码迷,mamicode.com
首页 > 其他好文 > 详细

jqGrid 使用心得

时间:2018-04-10 13:32:32      阅读:238      评论:0      收藏:0      [点我收藏+]

标签:姓名   用户数   print   adc   names   format   tca   ati   cti   

1.导入插件

<script src="~/Content/js/jqprint/jquery.jqprint-0.3.js"></script>

2.设置容器

<table style="height:49%;" id="orderGridList"></table>//表格
<div id="orderGridPager"></div>//分页

3.初始化

$("#orderGridList").jqGrid({            
            url: "/PlatformManage/Order/GetOrderList",//路径
            datatype: ‘json‘,//表格数据类型
            postData:   {searchText:searchText,name:name},//搜索时的参数
            height: $("#gridList").height() / 2 - 20,//表格高度
            autowidth: true,//表格宽度
            shrinkToFit: true,
            altRows: true,
            rownumbers: true,//是否显示行号
            rowNum: 10,//显示的行数
            rowList: [10, 25, 50, 100],//分页的
            colNames: ["Formid", "用户姓名", "微信备注名"],//表头名称
            colModel: [//对应json字段
                { name: ‘Formid‘, hidden: true },
                { name: ‘Customername‘, width: 70, align: ‘center‘ },
                {
                    name: ‘Distributionfee‘, width: 70, align: ‘center‘,
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue == 0 || cellvalue == "" || cellvalue == null || cellvalue == undefined || cellvalue == "undefined") {
                            return ‘0元‘;
                        }
                        else {
                            return cellvalue + ‘元‘;
                        }
                    }
                },
                {
                    name: ‘Createtime‘, width: 150, align: ‘center‘,
                    formatter: "date", formatoptions: { srcformat: ‘Y/m/d H:i:s‘, newformat: ‘Y/m/d H:i:s‘ }
                },
                {
                    name: "Id", width: 120, align: "center",
                    formatter: function (cellvalue) {
                        return "<button type=‘button‘ data-id=‘" + cellvalue + "‘ class=‘btn  btn-primary  btn-xs orderPrint‘>打印</button>";
                    }
                },
            ],
            pager: "#orderGridPager",//分页容器id
            caption: "订单列表",//表格标题
            hidegrid: true,
            sortname: ‘Createtime desc‘,//默认排序字段
            viewrecords: true,//是否展示表格右下角的记录总数提示
            onSelectRow: function (id) {//点击行的处理函数
                var orderId = $("#orderGridList").jqGridRowValue().Formid;
                //重新加载表格
                $("#goodGridList").setGridParam({ postData: { orderId: orderId }, page: 1 }).trigger(‘reloadGrid‘);
            },
            loadComplete: function (data) {//加载完成后的处理函数
                var wxTotalMoney = data.totalDataStatistical.OrderTJ_wxTotalMoney;//微信
                var yeTotalMoney = data.totalDataStatistical.OrderTJ_yeTotalMoney;//余额
                var psfTotalMoney = data.totalDataStatistical.OrderTJ_psfTotalMoney;//配送费
                var totalMoney = parseFloat((wxTotalMoney + yeTotalMoney).toFixed(2));//总计
                var customerCount = data.totalDataStatistical.OrderTJ_customerCount;//用户数量
                var vipCustomerCount = data.totalDataStatistical.OrderTJ_vipCustomerCount;//vip用户数量
                var notVipCustomerCount = data.totalDataStatistical.OrderTJ_notvipCustomerCount;//非vip用户数量
                var orderCount = data.totalDataStatistical.OrderTJ_orderCount;//订单数量
                var str = "总计:" + totalMoney + "元,微信到账:" + wxTotalMoney + "元,余额到账:" + yeTotalMoney + "元,配送费合计:" + psfTotalMoney + "元,订单数量:" + orderCount + "单,总用户数量:" + customerCount + "位,会员用户数量:" + vipCustomerCount + "位,非会员用户数量:" + notVipCustomerCount + "位";
                $(this).jqGrid("setCaption", "订单列表(" + str + ")");//设置表格标题
                $(this).find(".rating").each(function () {
                    $(this).rating(‘create‘);
                })
            }

 

  

jqGrid 使用心得

标签:姓名   用户数   print   adc   names   format   tca   ati   cti   

原文地址:https://www.cnblogs.com/kk-home/p/8778115.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!