当前位置: 代码迷 >> JavaScript >> extJs的常见有关问题
  详细解决方案

extJs的常见有关问题

热度:388   发布时间:2012-08-22 09:50:34.0
extJs的常见问题

1、hiden和destroy问题

当window执行window.close()方法时会触发closeAction的配置,默认配置为destroy,如果你使用默认的值 当关闭window(即执行window.close()或点击右上角的x)时不能通过show方法再次显示,当设置成hiden时可以通过show()再次显示。如果增加、修改和查看的窗体是在grid的里面,当关闭grid的时候会执行close()方法,此时的若window设置成hiden,window将不会被销毁,再次创建grid的时候,可能会出现id重复的现象,弹出的窗体会有问题,解决方案是当grid的销毁的时候会触发destroy事件,可以在destroy事件中添加销毁window的代码,例如:

                 this.on('destroy',function(){

this.addWindow.destroy();
this.editWindow.destroy();
this.viewEffect.destroy();

});


2、弹出的grid中的滚动条问题

在弹出的表格设置layout:vbox, flex=1时表格会自动添加滚动条,flex本意是盒布局各个item占父容器的比例问题 

this.addWindow =  Ext.create('Ext.window.Window', {
id:'effectFactorAddWindow',
title: '添加影响因素',
            closable: true,
            constrain : true,
            modal:true,
            closeAction: 'hide',
            width: 750,
            height: 450,
//            renderTo:Ext.getBody(),
            layout: 'fit',
            items:[{
            xtype:'form',
            id : 'effectFactorAddForm_'+brUnitRuleEffectGrid.moduleId,
            height:'20%',
            bodyStyle : 'padding:15px',
            width: 350,
            validateOnchange:false,
    column:2,
    layout: {
       type: 'vbox',
           align : 'stretch',
           pack  : 'start'
       },
    defaultType: 'textfield',
    items : [{
fieldLabel : 'ruleId',
id:'ruleId_effect',
name : 'ruleId',
hidden:true
},{
fieldLabel : '影响因素',
id:'brUnitEffectName_Add',
name : 'brUnitEffectName_Add',
allowBlank : false,
maxLength : 100,//允许输入的最大字符数2 
        maxLengthText : "最大长度不能超过100个字符!",//提示文本3 
height:20
// region:'north'
},{
fieldLabel : '添加影响因子',
id:'newBrUnitEffectFactor_Add',
name : 'newBrUnitEffectFactorJson_Add',
allowBlank : true,
hidden:true
// region:'north'
},brUnitRuleEffectGrid.brUnitRuleEffectFactorAddGrid = Ext.create('Ext.grid.Panel', {
// region:'center',
tbar : [ {
text : '添加',
iconCls : 'application_add',
handler : function(){
               // Create a model instance
               var r = Ext.create('Plant', {
                   name: '请填写名称',
                   type: '请填写类型',
                   value:'请填写值'
               });
               brUnitRuleEffectFactorAddStore.insert(0, r);
               cellEditingAdd.startEditByPosition({row: 0, column: 0});
           }},{
text : '删除',
iconCls : 'application_delete',
handler: function() {
               var sm = brUnitRuleEffectGrid.brUnitRuleEffectFactorAddGrid.getSelectionModel();
               cellEditingAdd.cancelEdit();
               brUnitRuleEffectFactorAddStore.remove(sm.getSelection());
               if (brUnitRuleEffectFactorAddStore.getCount() > 0) {
                   sm.select(0);
               }
           }
}],
flex:1,
           title: '影响因子',
               store: brUnitRuleEffectFactorAddStore,
               columns: [
                         {
                   header: '影响因子',
                   dataIndex: 'name',
                   flex: 1,
                   editor: {
                   maxLength : 50,//允许输入的最大字符数2 
           maxLengthText : "最大长度不能超过50个字符!",//提示文本3 
//            minLength : 1, //允许输入的最少字符数4 
//            minLengthText : "最小长度不能少于1个字符!",//提示文本
                       allowBlank: false
                   }
               },{
                   header: '类型',
                   dataIndex: 'type',
                   flex: 1,
                   editor: {
                   maxLength : 50,//允许输入的最大字符数2 
           maxLengthText : "最大长度不能超过50个字符!",//提示文本3 
//            minLength : 1, //允许输入的最少字符数4 
//            minLengthText : "最小长度不能少于1个字符!",//提示文本
                       allowBlank: true
                   }
               }, {header: '取值',
                   dataIndex: 'value',
                   flex: 1,
                   editor: {
                   maxLength : 100,//允许输入的最大字符数2 
           maxLengthText : "最大长度不能超过100个字符!",//提示文本3 
//            minLength : 1, //允许输入的最少字符数4 
//            minLengthText : "最小长度不能少于1个字符!",//提示文本
                       allowBlank: true
                   }}],
               plugins: [cellEditingAdd]
           })],
           buttons : [{
text : '确定',
formBind : true,
disabled : true,
handler : function() {
var addForm = this.up('form').getForm();
//本添加过的记录
addForm.findField('ruleId').setValue(ruleId);
var newRecords = brUnitRuleEffectGrid.brUnitRuleEffectFactorAddGrid.store.getNewRecords();
if(newRecords.length>0){
var uJsonArray1 = new Array();
for ( var i = 0; i < newRecords.length; i++) {
var newRecord = newRecords[i];
var uJson1 = {};

uJson1.value = newRecord.get('value');
uJson1.name = newRecord.get('name');
uJson1.type = newRecord.get('type');
uJsonArray1.push(uJson1);
}

addForm.findField('newBrUnitEffectFactorJson_Add').setValue(Ext.JSON.encode(uJsonArray1));
}else{
addForm.findField('newBrUnitEffectFactorJson_Add').setValue("");
}

//表单提交
var con = {};
           con.form = addForm;
           con.url = 'effect/addEffect.action';
           con.callBack = function(){
           brUnitRuleEffectGrid.addWindow.close();
           brUnitRuleEffectGridStore.load();
           };
           BusinessCommon.submitForm(con);
}
},{
            text:'取消',
            handler:function(){
            brUnitRuleEffectGrid.addWindow.close();
            }
           
           }]
            }]
});

  相关解决方案