AJAX_EXT EXT开发时，注意以及技巧

1.页面引入的JS文件又先后顺序，先是ext-base后是ext-all、CSS文件引入ext-all

 

<link rel="stylesheet" type="text/css" href="js/ext-3.2.1/resources/css/ext-all.css">
<script type="text/javascript" src="js/ext-3.2.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="js/ext-3.2.1/ext-all.js"></script> 

 

 2.ext事件指定：

 

Ext.onReady( function(){ Ext.get('控件ID').on( 'click', function(e){ alert(this.dom.value); //this.dom得到控件的dom节点后得到value值 } ); Ext.select('label').on( 'click', function(){ alert(this.innerText); } ); Ext.select('textarea').on( 'blur', function(){ alert(this.innerText); //得到文本域中的直接内容，比如输入“<input />” 显示的就是“<input />” alert(this.innerHTML); //得到文本域中的HTML内容，比如输入“<input />” 显示的就是“< input />” } ); } );   

 

 

3.Ext中的消息窗口：

    a.基本的通知： 类似于js的alert();只有一个确定:

// 基本的通知： 类似于js的alert();只有一个确定 Ext.Msg.alert('Status', 'Changes saved successfully.');

   

    b.有一个输入框，返回btn：按键的值，text：输入的值

//有一个输入框，返回btn：按键的值，text：输入的值 Ext.Msg.prompt('Name', 'Please enter your name:', function(btn, text){ alert(text); alert(btn); });  

     

     c.显示一个使用配置选项的对话框

var processResult = function(btn){ alert("btn : "+btn); } // 显示一个使用配置选项的对话框 Ext.Msg.show({ title:'Save Changes?', msg: 'You are closing a tab that has unsaved changes. Would you like to save your changes?', buttons: Ext.Msg.YESNOCANCEL, fn: processResult, animEl: 'elId', icon: Ext.MessageBox.ERROR });

 

 4.Ext文本框异步提交：

//异步提交,单个文本框的值 Ext.onReady(function(){ Ext.get('oKButton').on('click', function(){ var msg = Ext.get('msg'); var pa; msg.load({ url: 'http://www.baidu.com/s', //换成你的URL params: 'wd=' + Ext.get('name').dom.value, text: 'Updating...' }); msg.show(); }); });

 

 HTML代码：

<div id="msg" style="visibility: hidden" mce_style="visibility: hidden"></div> <p>Name: <input id="xx" type="text"/> <br /> <input type="button" id="oKButton" value="OK" /> </p> <p> </p>