日期:2014-05-16 浏览次数:20469 次
<script type="text/javascript">
Ext.onReady(function(){
??? var ds = new Ext.data.Store({//这是数据源
??? ??? proxy : new Ext.data.HttpProxy({url:'index.php?model=user&action=list&'}),
??????? reader: new Ext.data.JsonReader({
??? ??? ??? root: 'topics',
??????????? totalProperty: 'totalCount',
??????????? id: 'user_id'
??? ??? ??? },[
??? ??? ??? 'user_id','username','real_name','telephone','station_status','headship'
????? ??? ])
??? });
??? var colModel = new Ext.grid.ColumnModel([//定义列
??? ??? ?{header:'ID',width:50,sortable:true,dataIndex:'user_id'},
??? ??? ?{id:'title',header:'用户名', width:100,sortable:true,dataIndex:'username'},
??? ??? ?{header:'真实姓名',width:100,sortable:true,dataIndex:'real_name'},
??? ??? ?{header:'电话',width:100,sortable:true,dataIndex:'telephone'},
??? ??? ?{header:'岗位状态',width:100,sortable:true,dataIndex:'station_status'},
??? ??? ?{header:'职务',width:100,sortable:true,dataIndex:'headship'}
??? ??? ]);
??? var tb = new Ext.Toolbar('north-div');//创建一个工具条
???
??? tb.add({
??? ??? text: '添加',
??????? handler: newUser
??? ??? },{
??????? text: '编辑',
??????? handler: editUser
??? ??? },{
??????? text: '删除',
??????? handler: delUser
??? });
??? ???
??? var grid = new Ext.grid.GridPanel({//列表
??? ??? ??? ??? border:false,
??? ??? ??? ??? region:'south',
??? ??? ??? ??? height:500,
??? ??? ??? ??? loadMask: true,
??? ??? ??? ??? el:'center',
??? ??? ??? ??? title:'条目列表',
??? ??? ??? ??? store: ds,
??? ??? ??? ??? cm: colModel,
??? ??? ??? ??? autoScroll: true,
??? ??? ??? ??? bbar: new Ext.PagingToolbar({
??? ??? ??? ??? ??? pageSize: 20,
??? ??? ??? ??? ??? store: ds,
??? ??? ??? ??? ??? displayInfo: true,
??? ??? ??? ??? ??? displayMsg: '第{0} 到 {1} 条数据 共{2}条',
??? ??? ??? ??? ??? emptyMsg: "没有数据"
??????? ??? ??? })
??????????? });
??? var top = new Ext.FormPanel({//这里是搜索表单
??????? buttonAlign:'right',
??? ??? labelWidth:70,
??? ??? region:'center',
??????? frame:true,
??????? title: '搜索',
??????? items: [{
??? ??????????? layout:'column',
??? ??????????? items:[{
??? ??????????????? columnWidth:.33,
??? ??????????????? layout: 'form',
??? ??????????????? items: [{
??? ??????????????????? xtype:'textfield',
??? ??????????????????? fieldLabel: '用户名',
??? ??????????????????? id: 'username',
??? ??? ??? ??? ??? ??? name: 'username',
??? ??????????????????? anchor:'90%'
??? ??????????????? }]
??? ??????????? },{
??? ??????????????? columnWidth:.33,
??? ??????????????? layout: 'form',
??? ??????????????? items: [{
??? ??????????????????? xtype:'textfield',
??? ??????????????????? fieldLabel: '姓名',
??? ??????????????????? name: 'real_name',
??? ??? ??? ??? ??? ??? id: 'real_name',
??? ??????????????????? anchor:'90%'
??? ??????????????? }]
??? ??????????? },{
??? ??????????????? columnWidth:.33,
??? ??????????????? layout: 'form',
??? ??????????????? items: [{
??? ??????????????????? xtype:'textfield',
??? ??????????????????? fieldLabel: 'Email',
??? ??????????????????? name: 'email',
??? ??? ??? ??? ??? ??? id: 'email',
??? ??????????????????? vtype:'email',
??? ??????????????????? anchor:'90%'
??? ??????????????? }]
??? ??????????? }]
??????? ??? }
??????? ],
??????? buttons: [{
??????????? text: '保存',
??? ??? ??? handler:function(){
??????????????????????????????? // 这里是关键,重新载入数据源,并把搜索表单值提交
??? ??? ??? ??? ds.load({params:{start:0, limit:20,
??? ??? ??? ??? ??? username:Ext.get('username').dom.value,
??? ??? ??? ??? ??? real_name:Ext.get('real_name').dom.value,<