1 Ext.require(‘Ext.TabPanel‘); 2 Ext.application({ 3     name: ‘MyApp‘, 4     icon: ‘images/icon.png‘, 5     glossOnIcon: false, 6     tabletStartupScreen: ‘img/tablet_startup.png‘, 7     phoneStartupScreen: ‘img/phone_startup.png‘, 8     launch: function () { 9         var Content = Ext.create("Ext.form.Panel", {10             id: ‘PanelMain‘,11             scrollable: ‘vertical‘,12             items: [{13                 xtype: ‘fieldset‘,14                 title: ‘查询信息‘,15                 defaults: {16                     labelwidth: ‘10%‘17                 },18                 items: [{19                     xtype: ‘textfield‘,20                     id: ‘txt_title‘,21                     name: ‘title‘,22                     lable: ‘条件‘,23                     //文本框的提示24                     placeHolder: ‘请输入查询条件‘,25                     //必须的26                     required: true,27                     clearIcon: true,28                     //事件监听29                     listeners: {30                         //change是当失去焦点,keyup是按键抬起事件31                         change: function (item, newValue, oldValue) {32                             var tempValue = http://www.mamicode.com/this.getValue();33                             //如果用户输入的值长度大于等于2且小于等于334                             if (tempValue.length >= 2 & tempValue.length <= 3) {35                                 Ext.Ajax.request({36                                     //连接地址37                                     url: ‘http://localhost:5167/Tb_StuInfo.ashx‘,38                                     //传递方法39                                     method: ‘post‘,40                                     //参数41                                     params: {42                                         TempTc: "GetStuInfoByName",43                                         tempName: this.getValue(),44                                     },45                                     //请求成功的回调函数46                                     success: function (response) {47                                         var tem = eval("(" + response.responseText + ")");48                                         if (tem != null) {49                                             //判断50                                             var tempSex = tem.stu_Sex == 1 ? "男" : "女";51                                             //getCmd是按ID拿到要的控件，然后赋值52                                             Ext.getCmp(‘Temp_Show‘).setHtml("编号为:" + tem.stu_Id + "号<br/>姓名为:" + tem.stu_Name + "<br/>年龄是:" + tem.stu_Age + "岁<br/>性别为:" + tempSex + "<br/>电话号码:" + tem.stu_Tel);53                                         } else { Ext.getCmp(‘Temp_Show‘).setHtml(‘请输入您要查询的名称‘); }54                                     },55                                     failure: function () { alert("获取目录请求失败！"); }  // 请求失败的回调函数56                                 });57                             } else { console.log("还没运行!"); }58 59                         }60                     },61                 }, {62                     id: ‘Temp_Show‘,63                     name: ‘Temp_Show‘,64                     xtype: ‘panel‘,65                     title: ‘内容‘,66                     style: ‘margin-top:2px;background-color:#808080;‘,67                     height: ‘400px‘,68                     html: ‘请输入您要查询的名称‘69                 }]70             }71             ]72         });73         Ext.Viewport.add(Content);74     }75 });