动态创建data,grid组件，并填充json数据

clwbingo

描述：点击查询按钮，访问Baas的action，然后通过返回的 json数据，动态创建 data，grid组件，并将json数据填充至data，grid绑定data。

        Model.prototype.btnSelect = function(event) {
                $(this.getElementByXid("content2")).html(""); //查询前先清空 content2
                this.GetSalesList();
        };


Model.prototype.GetSalesList = function(event) {

                var startdate = this.comp('Startput').get('value');
                var enddate = this.comp('Endput').get('value');
                var params = {
                        StartDate : startdate,
                        EndDate : enddate
                };

                justep.Baas.sendRequest({
                        "url" : "/EtiAPP/APPService",   //改成自己的 baas 的url
                        "action" : "SearchSalesIndexSummary",   //改成自己的方法名
                        "async" : false,
                        "params" : params,
                        "success" : function(data) {
                                var strcolums = JSON.stringify(data.userdata.relationAlias);  //获取json中的列名字符串
                                var colums = strcolums.substring(1, strcolums.length - 1).split(',');

                                this.CreateDataElement(colums);  //根据列名创建data组件
                                this.BindList(data);  //绑定数据

                        }
                });
        };



        Model.prototype.CreateDataElement = function(colums) {
                var cc = {};
                for (var x = 0; x < colums.length; x++) {
                        var c1 = {
                                type : "String",
                                label : colums[x]
                        };
                        cc[colums[x]] = c1;
                }
                this.myNewData = new Data(this, {
                        xid : "myNewData",
                        defCols : cc,
                        idColumn : colums[x]   //"ID"

                });
        };



// 绑定数据
        Model.prototype.BindList = function(data) {

                var parentNode = this.getElementByXid("content2");
                var strcolums = JSON.stringify(data.userdata.relationAlias);
                var colums = strcolums.substring(1, strcolums.length - 1).split(',');
                var arr = [];
                for (var x = 0; x < colums.length; x++) {

                        var col1 = {
                                width : "80",
                                name : colums[x],
                                xid : "colum" + x,
                                resizable : false
                        };
                        arr.push(col1);
                }
                var data1 = this.comp('myNewData');
                data1.loadData(data);

                var option = {
                        parentNode : parentNode,
                        // grid的属性，设计时有的属性都可以设置
                        data : "myNewData",   //绑定data组件的名称
                        height : '100%',
                        hiddenCaptionbar : true,
                        // 冻结首列
                        frozenColumnCount : 1,
                        altRows : true,
                        appearance : 'grid',
                        useFooter : false,
                        onCellRender : "grid1CellRender",   //单元格渲染事件
                        onRowClick : "grid1RowClick",   //单击事件（也可以根据点击的时差，做成双击事件。移动端里双击事件用不了，通过单击事件转）
                        class : 'x-grid-title-center x-scroll-h x-scroll-v',
                        width : '100%',
                        // 列定义
                        colModel : arr,
                        xid : 'grid1'
                };
                new Grid(option);

        };