zoukankan      html  css  js  c++  java
  • easy ui datagrid 数据绑定

    1.前台页面

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <link href="../../../EasyUI/themes/default/easyui.css" rel="stylesheet" />
        <link href="../../../EasyUI/demo/demo.css" rel="stylesheet" />
        <link href="../../../EasyUI/themes/icon.css" rel="stylesheet" />
        <script src="../../../EasyUI/jquery.min.js"></script>
        <script src="../../../EasyUI/jquery.easyui.min.js"></script>
    
        <script>
            $(document).ready(function () {
                $('#list').datagrid({
                    title: '统计 报表',
                    iconCls: 'icon-save',
                     800,
                    height: 250,
                    url: "datagrid.js",
                    method:'get',
                    columns: [[
                    { title: '统计', colspan: 6 },
                    {
                        field: 'OID', title: '标题',  100, align: 'center', rowspan: 2,
    
                    }
                    ], [
                            { field: 'oid', title: '订单ID',  100 },
                            { field: 'Indate', title: '入住日期',  100, align: 'right' },
                            { field: 'outdate', title: '离店日期',  100, align: 'left' },
                            { field: 'roomnum', title: '房间数',  100 },
                            { field: 'price', title: '价格',  100 },
                            { field: 'pricecb', title: '成本价格',  100 }
                    ]],
                    pagination: true,
                    rownumbers: true
                });
            }
         );
        </script>
    </head>
    <body>
        <table id="list"></table>
    </body>
    </html>

    2.data

    {"total":100,"rows":[{"ID":"7","OID":"17","HotelID":"57","RoomTypeID":"216","SourceCID":"1","CID":"1","Indate":"2010-9-11 0:00:00","Price":"","THPrice":"","RoomNum":"1","PriceCB":"","PriceAC":"","HotelStatus":"0","SourceStatus":"0","CusPriceAC":"","RoomIn":"0","PrivataRoom":"0","CusPrice":"0","CUsID":"1","InStatus":"","OutStatus":"","InMoney":"","OutMoney":"","TableName":"T_OrderRoom"},{"ID":"202","OID":"67","HotelID":"57","RoomTypeID":"579","SourceCID":"1","CID":"1","Indate":"2010-10-7 0:00:00","Price":"825","THPrice":"660","RoomNum":"1","PriceCB":"700","PriceAC":"660","HotelStatus":"0","SourceStatus":"0","CusPriceAC":"","RoomIn":"0","PrivataRoom":"0","CusPrice":"0","CUsID":"1","InStatus":"","OutStatus":"","InMoney":"","OutMoney":"","TableName":"T_OrderRoom"}]}

    3.说明

     method:'get', 在请求时需要
  • 相关阅读:
    Mac 终端命令使用自动补全时忽略大小写设置
    Android App专项测试
    评估产品机会
    如何快速获取ListView的打气筒对象
    js处理日期格式yyyy-MM-dd hh:mm:ss
    websocket聊天时,图片压缩处理(url或者input-file)
    canvas图片压缩,局部放大,像素处理
    vscode 右键文件或者文件夹显示菜单
    HTML5-SQLLite连接
    ie下div模拟的表格,表头表体无法对齐
  • 原文地址:https://www.cnblogs.com/foreverfendou/p/4363561.html
Copyright © 2011-2022 走看看