Extjs 常用方法总结

1.Extjs5 中的model 属性是用于判断窗口是模态窗口还是非模态窗口，所谓的模态窗口指的是当 某一个窗口
 打开的时候，其余的窗口都不能再进行操作了，直到该窗口关闭。非模态窗口指的是，当该窗口处于打开状态，仍然可以操作别的窗口。
 2.创建一个新的window对象，该窗口不会自动显示出来，如果想要该窗口显示出来，可以调用其show()方法或者将其属性
  设置为true autoShow: true,如果想关闭该窗口 ，可以调用close()方法
 3. 在使用grid的时候，必须先要定义model，然后在定义store.
    //1.定义Model
Ext.define("MyApp.model.User", {
   extend: "Ext.data.Model",
   fields: [
{ name: 'name', type: 'string' },
{ name: 'age', type: 'int' },
{ name: 'phone', type: 'string' }
   ]
});
//2.创建store
var store = Ext.create("Ext.data.Store", {
   model: "MyApp.model.User",
   autoLoad: true,
   pageSize: 5,
   proxy: {
type: "ajax",
url: "GridHandler.ashx",
reader: {
   root: "rows"
}
   }
});
4.给某个按钮添加响应，需要对应的是handler:‘login’。后面对其的编辑可以使function login(){}或者是login：function(btn){}
 handler：function（）{
 }
5.ExtJS 给textfield赋值的方法总结
var value="值"; 
(1) fs.form.findField(id/name).setValue(value); 
(2) Ext.get(id/name).setValue(value); 
(3) Ext.getCmp(id).setValue(value); 
获取form里面的field的三种方法 
1)Ext.getCmp('id'); 
2)FormPanel.getForm().findField('id/name'); 
3)Ext.get('id/name');//前提是FormPanel在界面上显示出来了
6. 理解extjs的几个数据模型，其分别是 数据实体模型（Model），数据代理（Proxy），数据读取器（Reader）
   数据写入器（Writer），和数据集Store。
   数据实体模型Model代表了应用系统中用到的数据实体，其包含四个重要部分分别是：Field（字段定义），Proxy（数据代理），Association（模型关联），
   validation（数据校验）；
   数据代理Proxy用来处理数据的读取和保存，如通过ajax代理获取服务端的数据。
   数据读取器Reader，Writer用于读取原始数据到Model数据实体模型，或者将Model数据实体模型格式化为指定的数据格式。
   数据集Store是一个保存Model对象的客户端缓存，他提供了对数据的过滤，排序，查找等功能，常用于数据模型与UI组件的数据接口。
7.Ext.grid.panel的主要方法
   getSelectionModel 获取选择模式
   getStore 获取表格中的数据集
   getView获取表格中的视图对象
 8.Ext.grid.column.Column类定义了表格内部与列相关的配置，包括列标题和数据显示的相关内容，其主要配置项包括：
 columns: 参数类型Array 设置组列，数组中的列将作为一组处理，组列不能排序但可以隐藏和移动，组内的列可以移出组外，当所有的子列都被
 移出后组列将自动销毁。
 dataIndex（String） 设置列与数据集中数据的对应关系，值为数据模型中的字段名称
 flex（number）设置列宽占所有flex和的比例
 header（String） 设置列标题
 render(function )设置列的自定义渲染函数
 sortable(Boolean)是否允许排序，默认值为true,他将根据Ext.data.Strore.remoteSort判断进行本地排序还是远程排序
 text(String)设置列标题，header配置项优先
 width（number） 设置列宽
 9.选择模式是用来处理数据视图中的记录的选择状态，Ext.selection.Model是选择模式的基类，他的子类包括：Ext.selection.CellModel(单元格选择模式)，
 Ext.selection.CheckboxModel(复选框选择模式)和Ext.selection.RowModel(行选择模式)
 10.支持多选  multiSelect:true;
                       selModel:{
                            selType:'checkboxmodel'
     }
11.定义一个模型：
Ext.define('User',{
extend:'Ext.data.Model',
fields:[
   {name: 'name',type:'string'},
   {name: 'age',type:'number'}
]});
12.renderTo()指的是将Extjs组件加载到什么位置。Ext.toBody()  document.getBody()
13.如果既需要行编辑又需要列编辑，那么plugins应该怎么样写？
         var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
                clicksToMoveEditor: 1,
                autoCancel: false
            });//行编辑
            var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
                clicksToEdit: 1,
                autoCancel: false
            });//列编辑
           plugins:[rowEditing],
  plugins:[cellEditing]
14.如果要是想让一行成为一个链接，可以点击，那么 需要将改行的xtype设置为linkcolumn;
15.静态过滤store中的数据，filter和filterBy的区别？
16.模态窗口就是在该窗口关闭之前，其父窗口不可能成为活动窗口的那种窗口。
     非模态窗口指的是：父窗口和子窗口之间可以随意切换，当子窗口没有关闭的时候，仍然可以操作父窗口。
     模态对话框在显示之后，就不能对同一个程序中的其它窗口进行操作。
     非模态对话框在显示之后，还可以对同一个程序的其它窗口进行操作。
17.表格的相关操作：
   删除列：store.remove(store.getAt(i));
   刷新表格：grid.view.refresh();
   限制表格前面的复选款中只选一行：sm: new Ext.grid.RowSelectionModel({singleSelect:true})
18.修改完数据 一定要上传到服务器中
19.查看一个json的格式是否正确，可以借助“json在线解析/json在线格式化数据”    
20.Ext.JSON.encode():是将一个对象转编码成一个JSON格式的字符串
   Ext.JSON.decode(),是将一个JSON格式的字符串编码成为一个对象
21.Ext.Ajax.request（options）  也是可以查看api的，注意所有和Ext相关的都可以从api中查看到，要学会看api，学会在api中找到自己需要的知识。
  其中，可能的参数包括：
  URL：string/function() 请求的服务器地址，可以是一个字符串也可以是一个返回值为URL地址的函数
  params:Object/string/Function  包含请求参数的配置对象，或者包含字段名称和字段值对的字符串，
 callback:function 指定接收到服务器响应后的处理函数，不管是成功还是失败，该函数都将被调用
 success：function（）请求成功后的回调函数
 22.如何把一个控件render到一个div （不是body身上），<div id="myform" ></div>
 可以使用的方法是：render:"myform"   或者是renderTo：docuemnt.getElementById("myfrom")
23.关于拼接字符串，不要直接把后台得到的值 赋给前台需要的值，至少要进行encode,decode一下 ，要不然就是一个四不像。还有在赋值的时候，要深刻的理解该处要填的值是什么，是字符串就填写字符串，是数组就填写一个数组。series：[{},{}],它就是一个对象数组。（这里不是纯粹的拿来主义就可以了，虽然后台输出的是对象的样子，但他实际上是一个字符串）
encode和decode我总分不清楚，Encodes an Object, Array or other value. 返回的是一个字符串，decode的是一个json类型的字符串，返回的是一个对象。Decodes (parses) a JSON string to an object.
24.向后台传送一个json类型的字符串
手动拼写：   var params='{"zhibiao":"'+zhibiao+'","beginYear":"'+beginYear+'","endYear":"'+endYear+'"}';


25.combobox 是下拉框
{
xtype: 'combobox',
fieldLabel: Ext.tzGetResourse('TZ_RES_TMPL_MG_COM.TZ_RES_TMPL_STD.isneed','是否启用'),
forceSelection: true,
editable:false,
store: useFlagStore,
valueField: 'TValue',
displayField: 'TSDesc',
queryMode: 'remote',
name: 'isneed',
afterLabelTextTpl: [
   '<span style="color:red;font-weight:bold" data-qtip="Required">*</span>'
],
allowBlank: false
   }
  Checkbox是复选框
  {
    xtype:'checkbox',
    fieldLabel: Ext.tzGetResourse('TZ_SMS_TMPL_MG_COM.TZ_SMS_TMPL_STD.isuse','是否启用'),
    name: 'isuse',
    inputValue:'Y',(勾选上的取值)
    uncheckedValue:'N',(未勾选的取值)
    afterLabelTextTpl: [
'<span style="color:red;font-weight:bold" data-qtip="Required">*</span>'
    ]


}
26.测试迁到开发 ，开发里面的视图迁到测试，需要重新build一下，如果是新建的表或者是已经修改过的表，也需要重新build一下。
 否则，在测试环境下面没有，找不到。
 27.置灰样式  cls:'lanage_1'，表示该字段只读，不可修改
 28.关闭一个panel 的方法 this.getView().close();
 如果是一个gridPanel,也可以获取到这个grid,然后grid.close();
 29.注意区分tzLoad和tzSubmit  ，这两个方法的参数是不一样的
    var tzParams = '{"ComID":"TZ_ZXDC_MBGL_COM","PageID":"TZ_ZXDC_MBSZ_STD","OperateType":"QF","comParams":{"tplId":"'+tplId+'"}}';
        //加载数据
        Ext.tzLoad(tzParams,function(responseData){
            var formData = responseData.formData;
            form.setValues(formData);
        });
  /***************************************************************/
    var tzParams = '{"ComID":"TZ_ZXDC_WJGL_COM","PageID":"TZ_ZXDC_XJWJ_STD","OperateType":"U","comParams":' + tzStoreParams + '}';
            Ext.tzSubmit(tzParams,
                function(jsonObject) {
                  win.close();
                },"",true,this);
30.跳转到不同的component在他上面需要加上这样一句话：
Ext.tzSetCompResourses("TZ_ZNX_RYXZGL_COM");
31.页面上可以自定义属性，然后给整个属性赋值：
参考在线调查的 设置页面
32.ueditor 悬浮状态：zIndex:999（当父类型是panel的时候，不让他悬浮）
   忽略一个字段的变化 ignoreChangesFlag:true,（当这个字段变化时，点击关闭，窗口不会发生提示“未保存”）
33.给form表单中的数据赋值: form.setValues(formData);
   grid列表中的数据重新加载： var tzStoreParams = '{"TZ_APPPRO_TMP_ID":"'+smtDtTmpID+'"}';
                                                     //执行这个方法，相当于执行了tzQueryList()方法
                                                     grid.store.tzStoreParams = tzStoreParams;
                                                     grid.store.load();
34.grid的列的动态增加：列的动态生成。reconfigure，使用新的store和column动态生成列
35.自己写分页：
36.后台获取json数据，并对他进行处理，获得字符串类型的数据：
    rem 解析json类;
   Local JavaObject &jsonUtil = CreateJavaObject("com.tranzvision.util.PaseJsonUtil");
   rem 将字符串转换成json;
   Local JavaObject &CLASSJson = &jsonUtil.getJson(&comParams);
   rem 邮件群发批次编号;
   Local string &strEmailID = &CLASSJson.getString("emailID");
37.gridPanel的关闭：
    grid.close();


38.导出是在源数据库下面执行；导入是在目标数据库执行；使用DataMover导出导入
先执行导出，在执行导入
39.获取gird
 panel.child("grid");
40.获取grid 中store的方法 
 var store=grid.getStore();
 重新加载grid列表中的数据，重新获取一个store方法：
 store.comID="TZ_ZNX_RYXZGL_COM";
 store.pageID="TZ_ZNX_RYGL_STD";
 store.tzStoreParams='{"orgID":"'+orgID+'"}';
 store.load();
load()方法本身就具有这个作用
42.当encode 返回的JSON失效后，可以考虑手动拼写JSON类型的字符串：
 形式为：params='{"zhibiao":"'+zhibiao+'","beginYear":"'+beginYear+'","endYear":"'+endYear+'"}'参数传递，传过去的只能是一个字符串，返回来的也只能是一个字符串。
43.在提交迁移申请的时候，需要先在不同的环境下面克隆本项目（测试：test;培训：release；生产：master）,
特别注意：开发->测试（需要将自己修改的项目手动提交到测试环境，然后在提交申请）
                    测试->UAT(需要将手动修改的项目提交到UAT环境下面，然后再提交申请)(每次都忘记将修改的提交，然后就提交申请！！！)
   UAT->生产(生产环境下面不需要手动将修改的内容提交（自己不能推送，需要相关部署人去推送），只需要发送申请就好了)
44.Ext参数请求
tzParams{
 "comID":"XXX",
 "pageID":"XXX",
 "OperateType":"XXX",操作类型（U-更新（新增(add)、修改(update)、删除(delete)）QF-查询表单，QG-查询列表）
 "comParams":"XXX"
}
45.点击下拉框立即有反应，comboBoxField,可以将他的属性设置成editable:false 
46.日期类型的显示字段  格式化为标准的形式 使用这个 format:'Y-m-d' 
47.html style margin
  margin 属性设置元素的外边距；
  如果规定一个值，比如div{margin:50px}-所有的外边距都是50px;
  如果规定两个值，比如div{margin:50px 10px}--上下外边距都是50px，左右外边距都是10px;
  如果规定三个值，比如div{margin:50px 10px 20px}--上外边距是50px,右外边距是10px,下外边距是20px;
  如果规定四个值，比如div{margin:50px 10px 20px 30px}--上外边距是50px,右外边距是10px,下外边距是20px,左外边距是30px
48.%DateOut() 用在ps设计器里面，可以直接SQL里面，输出日期形式；
%DateTimeOut(),用于输出日期时间形式；
SELECT TZ_ART_ID 
 ,TZ_NACT_NAME 
 ,TZ_NACT_ADDR 
 ,%DateOut(TZ_START_DT) 
 ,%DateTimeOut(TZ_START_TM) from  AAAAAA；
 49. Evaluate &strMonth
         When = "1"
   "AAAAAA";
 When="2"
   "BBBBB";
end-evaluate;
50.后台获取页面上某一个按钮，并将其设置为只读
var btn=panel.child('form').down("button[name=startReview]")；

btn.setDisabled(true);

51.遍历store中的数据以及获取某一列的数据

myStore.each(function(rec)){

console.log(rec.get('name'));

}