extjs 实现自动创建表格，多行编辑

 

Ext.ns('Ext.module.examine');

Ext.module.examine.editorExamineDept = function(selectid, depttype, examinetype) {   

    var viewReportResultDS = new Ext.data.Store({                                                                //创建一个Store

                proxy:new Ext.data.HttpProxy({url:'webos/examine/viewExamineGrade.do?id=' + selectid + '&depttype=1&examinetype=ldpj'}),
                reader:new Ext.data.JsonReader({
                            totalProperty: 'total',
                            root: 'results',
                            fields:[
                                {
                                    name: 'id'
                                },
                                {
                                    name: 'deptid'
                                },
                                {
                                    name: 'deptname'
                                },
                                {
                                    name: 'score'
                                },
                                {
                                    name: 'scoretype'
                                } ,

                                {
                                    name: 'execution'
                                },
                                {
                                    name: 'examineid'
                                },
                                {
                                    name: 'depttype'
                                },
                                {
                                    name: 'registerid'
                                },
                               {
                                    name: 'examinetype'
                                }

                            ]})
            });
    viewReportResultDS.load();

 

 

    var resultColModel = new Ext.grid.ColumnModel([  //
        new Ext.grid.RowNumberer(),
        //行自动加1
        {
            id:'id',
            header: "id",
            //表格列头名称
            width: 100,
            dataIndex: 'id',
            //字段名称

            //是否允许按列排序，默认为false
            hidden: true  //是否隐藏本列
        },

        {
            id:'deptid',
            header: "deptid",
            //表格列头名称
            width: 100,
            dataIndex: 'deptid',
            //字段名称
            //是否允许按列排序，默认为false
            hidden: true  //是否隐藏本列
        },

        {
            id:'examineid',
            header: "examineid",
            //表格列头名称
            width: 100,
            dataIndex: 'examineid',
            //字段名称
            //是否允许按列排序，默认为false
            hidden: true  //是否隐藏本列
        },
       {
            id:'depttype',
            header: "depttype",
            //表格列头名称
            width: 100,
            dataIndex: 'depttype',
            //字段名称
            //是否允许按列排序，默认为false
            hidden: true  //是否隐藏本列
        },

        {
            id:'registerid',
            header: "registerid",
            //表格列头名称
            width: 100,
            dataIndex: 'registerid',
            //字段名称
            //是否允许按列排序，默认为false
            hidden: true  //是否隐藏本列
        },
        {
            id:'examinetype',
            header: "examinetype",
            //表格列头名称
            width: 100,
            dataIndex: 'examinetype',
            //字段名称
            //是否允许按列排序，默认为false
            hidden: true  //是否隐藏本列
        },

        {
            id:'deptname',
            header: "单位",
            width: 200,
            dataIndex:'deptname'
        },

        {
            id:'execution',
            header: "评分类型",
            width: 200,
            dataIndex: 'execution'

          

        },

 

        {
            id:'score',
            header: "分数",
            width: 200,
            dataIndex: 'score',
            editor:new Ext.form.NumberField({
                        minValue:0 ,
                        maxValue:20,
                        maxText:'最大值为20'
                    })
        }

    ]);
    /**
     * 创建表格
     */
    var resultFileList = {
        id:'resultFileList',
        store:viewReportResultDS,
        cm:resultColModel,
        plugins: [new Ext.ux.grid.DragSelector()],
        viewConfig: {forceFit:true},
        autoWidth:true,
        // autoHeight:true
        height:461
    };

    var viewExamineDeptsGridForm = new Ext.grid.EditorGridPanel({//
                id: 'viewDeptOriginalGridForm',
                frame: true,
                cm:resultColModel,
                store:viewReportResultDS,
                hegith:'100%',
                region:"center",
                layout:'fit',
                //  autoExpandColumn:3,
              //  items:new gridPanel(resultFileList).grid(),
                tbar:[
                    {
                        text:"返回",
                        iconCls:'remove',
                        handler:function() {
                            win.close();
                        }
                    }
                ]

            });

    viewExamineDeptsGridForm.on({               //保存时候用
                'afteredit': {
                    fn: function(obj) {                //得到需要保存的内容
                        var r = obj.record;
                        var id = r.get("id");                          
                        // var itemId=r.get("itemId");
                        //var orgname=r.get("orgname");
                        var scoretype = r.get("scoretype");
                        var score = r.get("score");
                        var examineid = r.get("examineid")
                        var depttype = r.get("depttype")
                        var registerid = r.get("registerid")
                        var examinetype = r.get("examinetype")
                        Ext.Ajax.request({
                                    success:function(response, options) {
                                        var respText = Ext.util.JSON.decode(response.responseText);
                                        console.log(respText)
                                        var isupdate=respText.success;
                                         console.log(isupdate)
                                        if(!isupdate){
                                           Ext.MessageBox.show({
                                         title:'消息',
                                         width:300,
                                         msg:respText.info,
                                         buttons:Ext.MessageBox.OK,
                                         fn:function(btn) {
                                         if (btn == 'ok') {
                                         viewReportResultDS.load();
                                         }
                                         }
                                         })
                                        }else{
                                        viewReportResultDS.load();
                                        }
                                    },
                                       failure:function(response, options){
                                           var respText = Ext.util.JSON.decode(response.responseText);

                                            Ext.MessageBox.show({
                                                        title:'消息',
                                                        width:300,
                                                     //   msg:'优秀评价票请控制在4票以内或保存失败 ！',
                                                        msg:respText.info,
                                                        buttons:Ext.MessageBox.OK,
                                                        fn:function(btn) {
                                                            if (btn == 'ok') {
                                                                viewReportResultDS.load();
                                                            }
                                                        }
                                                    })
                                        },
                                    scope:this,
                                    url:"webos/examine/updateExamineGrade.do?examinetype=ldpj",
                                    params:{'id':id,'score':score ,'depttype':depttype,

                                         'registerid':registerid,'examinetype':examinetype
                                    }
                                })
                    }
                }});

    var win = Ext.getCmp('editorExamineDepts-win');
    if (!win) {

        /*  viewExamineDeptsGridForm.load({
                  waitTitle:'请稍等'}); */

        win = new Ext.Window({
                    id: 'editorExamineDepts-win',
                    title:'基本信息表',
                    iconCls: 'bogus',
                    width:800,
                    height:300,
                    layout:'fit',
                    autoScroll:true,
                    resizable:true,//布尔类型，用户是否可以调整窗体大小，默认值为true表示可以调整大小。
                    animCollapse:true,
                    constrainHeader:true,
                    minimizable:true, //true表示显示最大化按钮，默认值为false。
                    maximizable:true,
                    items:[
                        {
                            columnWidth: 1,
                            layout:'fit',
                            width:300,
                            height:300,
                            items:viewExamineDeptsGridForm
                        }
                    ]
                })
    }
    win.show();
    baseForm = Ext.getCmp("examineDocForm").form;

}