• easyui中datagrid用法,加载table数据与标题


    加载标题写法:

    多行标题:columns: [[
        columns: [[
                           { field: 'itemid', title: 'Item ID', rowspan: 2, 80, sortable: true },
                           { field: 'productid', title: 'Product ID', rowspan: 2, 80, sortable: true },
                           { title: 'Item Details', colspan: 4 }
                           ], [
                          { field: 'listprice', title: 'List Price', 80, align: 'right', sortable: true },
                           { field: 'unitcost', title: 'Unit Cost', 80, align: 'right', sortable: true },
                           { field: 'attr1', title: 'Attribute', 100 },
                           { field: 'status', title: 'Status', 60 }
                           ]]

    单行标题用Js实现:

    $('#tt').datagrid({
    columns: [[
    { field: 'itemid', title: 'Item ID', 80 },
    { field: 'productid', title: 'Product ID', 80 },
    { field: 'listprice', title: 'List Price', 80, align: 'right' },
    { field: 'unitcost', title: 'Unit Cost', 80, align: 'right' },
    { field: 'attr1', title: 'Attribute', 100 },
    { field: 'status', title: 'Status', 60 }
    ]]
    });

    实现一个table的数据加载例子:

    静态:   

     var data_ = [{

                "dataindex0": "1",

                "dataindex1": "Y08",

                "dataindex2": "Y00000000158",

                "dataindex3": "注",

                "dataindex4": "Z",

                "dataindex5": "注",

                "dataindex6": "250",

                "dataindex7": "东北厂",

                "dataindex8": "国",

                "dataindex9": "123123",

                "dataindex10": null,

                "dataindex11": null,

                "dataindex12": null,

                "dataindex13": null

            },

           {

                "dataindex0": "1",

                "dataindex1": "Y08",

                "dataindex2": "Y00000000158",

                "dataindex3": "注",

                "dataindex4": "Z",

                "dataindex5": "注",

                "dataindex6": "250",

                "dataindex7": "东北厂",

                "dataindex8": "国",

                "dataindex9": "123123",

                "dataindex10": null,

                "dataindex11": null,

                "dataindex12": null,

                "dataindex13": null

            }];

       方法一:

     $('#dg').datagrid({

            fit: true,

            checkOnSelect: true,

            selectOnCheck: true,

            singleSelect: true,

            fitColumns: true,

            data:data_,

            //pageSize:100,

            //pagination:true,

            columns: [[

                { field: 'dataindex0', title: 'dataindex0', 80 },

                { field: 'dataindex1', title: 'dataindex1', 80 },

                { field: 'dataindex2', title: 'dataindex2', 80 },

                { field: 'dataindex3', title: 'dataindex3', 80 },

                { field: 'dataindex4', title: 'dataindex4', 80 },

                { field: 'dataindex5', title: 'dataindex5', 80 },

                { field: 'dataindex6', title: 'dataindex6', 80 },

                { field: 'dataindex7', title: 'dataindex7', 80 },

                { field: 'dataindex8', title: 'dataindex8', 80 },

                { field: 'dataindex9', title: 'dataindex9', 80 }

            ]]

        });

    方法二:

     $('#dg').datagrid({

            fit: true,

            checkOnSelect: true,

            selectOnCheck: true,

            singleSelect: true,

            fitColumns: true,

            //pageSize:100,

            //pagination:true,

            columns: [[

                { field: 'dataindex1', title: 'dataindex1', 80 },

                { field: 'dataindex2', title: 'dataindex2', 80 },

                { field: 'dataindex3', title: 'dataindex3', 80 },

                { field: 'dataindex4', title: 'dataindex4', 80 },

                { field: 'dataindex5', title: 'dataindex5', 80 },

                { field: 'dataindex6', title: 'dataindex6', 80 },

                { field: 'dataindex7', title: 'dataindex7', 80 },

                { field: 'dataindex8', title: 'dataindex8', 80 },

                { field: 'dataindex9', title: 'dataindex9', 80 },

                { field: 'dataindex10', title: 'dataindex10', 80 }

            ]]

        });

  • 相关阅读:
    路由器DHCP 动态主机配置
    nat转换
    静态路由的实验
    不同vlan之间的相互访问
    IP的包头格式什么?请分析每个字段的含义
    IP地址的分类
    关于对JSON.parse()与JSON.stringify()的理解
    Ajax工作原理
    关于css伪类
    开发 | 如何在微信小程序的页面间传递数据?
  • 原文地址:https://www.cnblogs.com/huangf714/p/5832297.html
Copyright © 2020-2023  润新知