zoukankan      html  css  js  c++  java
  • JqGrid 显示表格

    JqGrid 是前台的表格显示库,使用起来相当方便。
    这里分享下本人使用过程中遇到的问题及解决方案
    **

    一.rowNum属性

    **
    1.如果不设置,默认显示数是20,也就是说超过20以后的数据。不再显示出来。初次使用JqGrid的经常忽视此属性,导致后期显示出现问题

    2.-1
    rowNum=-1时忽略显示行最大值的检查。一劳永逸。怎么样数据都可以显示出来。但是本人在使用过程中发现设置rowNum=-1时,表格无法显示最后一行的数据
    显示数据从本地获取(datatype: “local”),怎么调试发现都无法显示最后一行。估计是JqGrid的一个bug。使用时一定要小心。

    3.基于1,2 rowNum值最好就是设置为真实数据的最大值。是个动态值。

    4.rowNum设置为真实数据的最大值。可能有人认为无法进行动态行添加了。其实不会这样,rowNum检查,只会发生在表格初期加载的时候。

    **

    二. sortable 属性

    **
    排序功能:
    排序是必须要数据加载完全才可以进行排序,所以sortable属性一定要放在colModel属性后面,否则数据显示不完全,参靠下面设置

    $("#security").jqGrid(
    {
        datatype :"local",
        data :data,
        mtype :"POST",
        colNames :colNames,
        colModel :colModel,
        height :226,
        sortable :true,
        cellEdit :false,
        rowNum : data.length
    });

    三.动态为每个cell设置css
    为cell动态设置css。可以在表格加载完全后设置gridComplete属性中设置

    gridComplete : function() {
        //取得所有行ID
        var rowIds = $("#data").getDataIDs();
        for ( var index = 0; index < rowIds.length; index++) {
            var $tr = $("#" + rowIds[index]);
            //行背景标志位
            var rowFlg = $("#data").getRowData(index).rowFlg;
            var background = "";
            if (rowFlg == "1") {
                background = "add";
            } else if (rowFlg == "2") {
                background = "delete";
            } else {
                background = "update";
            }
            $tr.addClass(background);
            //设置每个cell背景
            $tr.find("td:eq(3)").addClass(
                    $("#data").getCell(rowIds[index],
                            "Flg3"));
            $tr.find("td:eq(4)").addClass(
                    $("#data").getCell(rowIds[index],
                            "Flg4"));
            $tr.find("td:eq(5)").addClass(
                    $("#data").getCell(rowIds[index],
                            "Flg5"));
            }
    }
    

    以上是目前开发遇到的问题,和解决方案。后续继续补充

  • 相关阅读:
    11. 盛最多水的容器
    820. 单词的压缩编码
    72. 编辑距离
    10041-回文数
    第六章-希尔排序和堆排序
    第六章-快速排序、合并排序
    第六章 排序-冒泡,选择,插入排序
    第四章-二叉树的运用-AVL平衡二叉树
    第四章-二叉树的运用-排序二叉树的代码
    第四章-二叉树的代码 、二叉树前序中序后序遍历、及运用
  • 原文地址:https://www.cnblogs.com/stoneFang/p/6715309.html
Copyright © 2011-2022 走看看