
<html>
<head>
<title>jquery表格 *** 作</title>
<script language="javascript" src="jquery.table.tr.js"></script>
<style type="text/css">
table
{
border: black solid 1px
border-collapse: collapse
}
td
{
border: black solid 1px
padding: 3px
}
.td_Num
{
width: 60px
text-align: center
}
.td_Item
{
width: 160px
text-align: center
}
.td_Oper
{
width: 120px
text-align: center
}
.td_Oper span
{
cursor: pointer
}
</style>
</head>
<body>
<table>
<tr>
大致思路://声明好对应grid的Record对象
var ItemRecord = Ext.data.Record.create([
{name:'oid'},
{name:'oidname'},
{name:'vendor'}
])
//点那个添加按钮时则执行类似如下函数
function addRow2Grid(grid){
var values = Ext.getCmp('your_form_id').getForm().getValues() //form各字段的name属性要和ItemRecord里对应以便下面赋值。可以先console.log(values)看看值。
var rec = new ItemRecord(values)//实例化Record对象并赋值
//var rec =new grid.store.recordType(values)//试试这种行不,省了提前声明ItemRecord. grid.store.insert(grid.store.getCount(), rec) //插入作为grid最后一行
grid.getView().refresh()//刷新
}
Ext.onReady(function() {
var sm=new Ext.grid.CheckboxSelectionModel()
var cm=[new Ext.grid.RowNumberer(),sm,
{header:"编号", dataIndex:"id", width:65,hidden : true},
{header:"名称", dataIndex:"name", width:65},
{header:"路径", dataIndex:"url", width:65}
]
var fd = ["id", "name", "url"]
var store=new Ext.data.JsonStore({
fields:fd
})
var data=[{
id:1,name:"xiao",url:"sssssssssss",sex:"male"
}]
var grid=new Ext.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(){
var res = {fields:[{name:"sex"}],columns:[{header:'性别',dataIndex:"sex",width:65}]}
var columns = res.columns
var fields = res.fields
for (var i = 0 i < fields.length i++) {
fd.push(fields[i].name)
cm.push(columns[i])
}
//重新绑定store及column
ss=new Ext.data.JsonStore({
fields:fd
})
grid.reconfigure(ss,new Ext.grid.ColumnModel(cm))
ss.loadData(data)
}
}]
})
var win=new Ext.Window({
title:"sssssss",
width:700,
height:500,
layout:"fit",
closable:true,
items:[grid]
})
win.show()
})
主要是grid里的reconfigure这个方法:配置grid以使用一个不同的Store和Column Model并触发'reconfigure'事件。 视图将会被绑定到新的对象并刷新。
你自己引用ext3的类库吧~
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)