extjsgrid动态添加列

① extjs 表格如何实现动态添加列

Ext.onReady(function(){

varsm=newExt.grid.CheckboxSelectionModel();

varcm=[newExt.grid.RowNumberer(),sm,

{header:"编号",dataIndex:"id",width:65,hidden:true},

{header:"名称",dataIndex:"name",width:65},

{header:"路径",dataIndex:"url",width:65}

]

varfd=["id","name","url"];

varstore=newExt.data.JsonStore({

fields:fd

})

vardata=[{

id:1,name:"xiao",url:"sssssssssss",sex:"male"

}]

vargrid=newExt.grid.GridPanel({

sm:sm,

columns:cm,

store:store,

width:500,

height:400,

tbar:[{

text:"生成",

icon:"images/icons/add.png",

cls:"x-btn-text-icon",

handler:function(){

varres={fields:[{name:"sex"}],columns:[{header:'性别',dataIndex:"sex",width:65}]};

varcolumns=res.columns;

varfields=res.fields;

for(vari=0;i<fields.length;i++){

fd.push(fields[i].name);

cm.push(columns[i]);

}

//重新绑定store及column

ss=newExt.data.JsonStore({

fields:fd

});

grid.reconfigure(ss,newExt.grid.ColumnModel(cm));

ss.loadData(data)

}

}]})varwin=newExt.Window({

title:"sssssss",

width:700,

height:500,

layout:"fit",

closable:true,

items:[grid]

})

win.show();

});

主要是grid里的reconfigure这个方法：配置grid以使用一个不同的Store和Column Model并触发'reconfigure'事件。 视图将会被绑定到新的对象并刷新。

你自己引用ext3的类库吧~

② Extjs5.0版本当中Ext.grid.GridPanel如何能够通过增加xtype:'actioncolumn',操作列来实现这样的设置操作

在做的demo里加了一个字段 is_master,和你的问题有类似的处理，我默认的只能有一个用户为master，点击设为master后，重新加载数据,实现切换

更新sql:

update hs_user t set t.IS_MASTER=0 WHERE t.IS_MASTER=1;

update hs_user t set t.IS_MASTER=1 WHERE t.ID in (16);

-----------------------

希望以上对你有帮助

③ 已知name与id=值，如何在extjs的grid动态添加一行（这一行这有name和id两列），求详细方法，急！！！！！

var Plant = grid.getStore().recordType;
var p = new Plant({
name:值抄,
Id:值

});
grid.stopEditing();
grid.getStore().insert(0, p);
grid.startEditing(0,0);

在知道袭值之后 加这样段代码 试试

④ ExtJS grid表头如何增加下拉项

extjs自己提供复选框列

//checkbox列

varfilecheckbox=newExt.grid.CheckboxSelectionModel();

//GridPanel

varfileGrid=newExt.grid.GridPanel({

store:fileStore,

columns:[

newExt.grid.RowNumberer(),//显示列数

filecheckbox,//显示复选框列

{//其他显示列}]

//省略其他属性

});

这样你就可以而得到一个复选框，可以进行单选、全选了

如果你想自己定义的话，也可以

//定义filters

varfilters=newExt.ux.grid.GridFilters({

//

encode:encode,//jsonencodethefilterquery

local:local,//defaultstofalse(remotefiltering)

filters:[{

type:'numeric',

dataIndex:'id'

},{

type:'string',

dataIndex:'company',

disabled:true

},{

type:'numeric',

dataIndex:'price'

},{

type:'date',

dataIndex:'date'

},{

type:'list',

dataIndex:'size',

options:['small','medium','large','extralarge'],

phpMode:true

},{

type:'boolean',

dataIndex:'visible'

}]

});

//

//

//thefiltertypes(

varcreateColModel=function(finish,start){

varcolumns=[{

dataIndex:'id',

header:'Id',

//=true

//tousestore'sfield'stypeproperty(iftypepropertynot

//'auto'which

//GridFilterswillassumetobe'StringFilter'

filterable:true

//,filter:{type:'numeric'}

},{

dataIndex:'company',

header:'Company',

id:'company',

filter:{

type:'string'

//

//,disabled:true

}

},{

dataIndex:'price',

header:'Price',

filter:{

//type:'numeric'//

}

},{

dataIndex:'size',

header:'Size',

filter:{

type:'list',

options:['small','medium','large','extralarge']

//,phpMode:true

}

},{

dataIndex:'date',

header:'Date',

renderer:Ext.util.Format.dateRenderer('m/d/Y'),

filter:{

//type:'date'//

}

},{

dataIndex:'visible',

header:'Visible',

filter:{

//type:'boolean'//

}

}];

returnnewExt.grid.ColumnModel({

columns:columns.slice(start||0,finish),

defaults:{

sortable:true

}

});

};

然后

vargrid=newExt.grid.GridPanel({

colModel:createColModel(4),

plugins:[filters],

//这两个属性是重点，加上去就可以了

});

效果看图片。

建议你去下载官方的源代码，然后看其中的例子。

里面有一个就是如何自定义这个的