连接数据库的GridPanel

Ext.onReady(function (){
    var _grid=new Ext.grid.GridPanel({
    id:"view_grid",
    renderTo:Ext.getBody(),
height:200,
width:350,
//enableColumnMove:false,列不可拖动
    //colModel等同于columns
    colModel:new Ext.grid.ColumnModel([
                        {header: "姓名", width: 100, sortable: true, dataIndex: 'name'},//menuDisabled:true 锁定工具条的功能
                        {header: "年龄", width: 100, sortable: true, dataIndex: 'sex'},
                        {header: "性别", width: 100, sortable: true, dataIndex: 'age'}
]),
     store:new Ext.data.JsonStore({
        autoLoad:true,//等同_store.load();
                              //url指定路径(数据)
    proxy:new Ext.data.HttpProxy({url:"http://localhost/IISHelp/ExtJSTest/server/app/test/11/xmlstore.asp"}),
    fields:["name","sex","age"]
     }),
selModel:new Ext.grid.RowSelectionModel({
     singleSelect:true,
listeners:{
        //第一个参数自己本生
//第2个参数第几行
                       "rowselect":function(_sm, _index , _r){
                 alert(_index);
//把数据加载到formPanel
Ext.getCmp("view_form").getForm().loadRecord(_r);
                                           }
}   

})
});

var _form= new Ext.form.FormPanel({
          id:"view_form",
          height:200,
  width:350,
          frame:true,
  renderTo:Ext.getBody(),
  defaultType:"textfield",
  items:[{
      fieldLabel:"姓名",
  name:"name"
  },{
      fieldLabel:"年龄",
  name:"age"
  },{
      fieldLabel:"性别",
  name:"sex"
  }],
  buttons:[{
     text:"修改",
handler:function(){
   if(Ext.getCmp("view_grid").getSelectionModel().getCount==0)
   {
       return;
   }
   //被选中的行
    Ext.getCmp("view_grid").getSelectionModel().getSelected()
    var _form =this.ownerCt.getForm().getValues();
    _rs.set("name",_values["name"]);
_rs.set("sex",_values["sex"]);
_rs.set("age",_values["age"]);
//提交(必须的)
_rs.commit();
}
  }]    
});
  
})

 

你可能感兴趣的:(ext,asp)