20jqGrid - 主从表格

最新推荐文章于 2021-06-09 19:49:15 发布
最新推荐文章于 2021-06-09 19:49:15 发布
阅读量784 收藏 1
点赞数 3
分类专栏： # JQGrid
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_20042935/article/details/89489086
版权

这个例子展示了两个表格的关系，并且如何实现主从关系。
在这里插入图片描述

HTML代码举例

<html>
  <head>
    <title>jqGrid 实例</title>
  </head>
  <body>
    ···代码省略···
    Invoice Header
    <table id="list10"></table>
    <div id="pager10"></div>
    <br /> Invoice Detail
    <table id="list10_d"></table>
    <div id="pager10_d"></div>
    <a href="javascript:void(0)" id="ms1">Get Selected id's</a>
    ···代码省略···
  </body>
</html>

javascript代码举例

$(function(){
  pageInit();
});
function pageInit(){
  jQuery("#list10").jqGrid(
          {
            url : ctx+'/JSONData',
            datatype : "json",
            colNames : [ 'Inv No', 'Date', 'Client', 'Amount','Tax', 'Total', 'Notes' ],
            colModel : [ 
                         {name : 'id',index : 'id',width : 55}, 
                         {name : 'invdate',index : 'invdate',width : 90}, 
                         {name : 'name',index : 'name',width : 100}, 
                         {name : 'amount',index : 'amount',width : 80,align : "right"}, 
                         {name : 'tax',index : 'tax',width : 80,align : "right"}, 
                         {name : 'total',index : 'total',width : 80,align : "right"}, 
                         {name : 'note',index : 'note',  width : 150,sortable : false} 
                       ],
            rowNum : 10,
            rowList : [ 10, 20, 30 ],
            pager : '#pager10',
            sortname : 'id',
            viewrecords : true,
            sortorder : "desc",
            multiselect : false,
            caption : "Invoice Header",
            onSelectRow : function(ids) {
              if (ids == null) {
                ids = 0;
                if (jQuery("#list10_d").jqGrid('getGridParam',
                    'records') > 0) {
                  jQuery("#list10_d").jqGrid(
                      'setGridParam',
                      {
                        url : ctx+"/SubGrid?q=1&id="
                            + ids,
                        page : 1
                      });
                  jQuery("#list10_d").jqGrid('setCaption',
                      "Invoice Detail: " + ids).trigger(
                      'reloadGrid');
                }
              } else {
                jQuery("#list10_d").jqGrid('setGridParam', {
                  url : ctx+"/SubGrid?q=1&id=" + ids,
                  page : 1
                });
                jQuery("#list10_d").jqGrid('setCaption',
                    "Invoice Detail: " + ids).trigger(
                    'reloadGrid');
              }
            }
          });
  jQuery("#list10").jqGrid('navGrid', '#pager10', {
    add : false,
    edit : false,
    del : false
  });
  jQuery("#list10_d").jqGrid({
    height : 100,
    url : ctx+'/SubGrid?q=1&id=0',
    datatype : "json",
    colNames : [ 'No', 'Item', 'Qty', 'Unit', 'Line Total' ],
    colModel : [ 
                 {name : 'num',index : 'num',width : 55}, 
                 {name : 'item',index : 'item',width : 180}, 
                 {name : 'qty',index : 'qty',width : 80,align : "right"}, 
                 {name : 'unit',index : 'unit',width : 80,align : "right"}, 
                 {name : 'linetotal',index : 'linetotal',width : 80,align : "right",sortable : false,search : false} 
               ],
    rowNum : 5,
    rowList : [ 5, 10, 20 ],
    pager : '#pager10_d',
    sortname : 'item',
    viewrecords : true,
    sortorder : "asc",
    multiselect : true,
    caption : "Invoice Detail"
  }).navGrid('#pager10_d', {
    add : false,
    edit : false,
    del : false
  });
  jQuery("#ms1").click(function() {
    var s;
    s = jQuery("#list10_d").jqGrid('getGridParam', 'selarrrow');
    alert(s);
  });
}

java servlet代码举例

public class JSONData extends HttpServlet {
  private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public JSONData() {
        super();
        // TODO Auto-generated constructor stub
    }

  @Override
  protected void doGet(HttpServletRequest req, HttpServletResponse resp)
      throws ServletException, IOException {
    // TODO Auto-generated method stub
    doPost(req,resp);
  }

  /**
   * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
   */
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // TODO Auto-generated method stub
    String page = request.getParameter("page");
    String jsondata = "{}";
    if("1".equals(page)){
      jsondata = "{\"page\":\"1\"," +
          "      \"total\":2," +
          "      \"records\":\"13\"," +
          "      \"rows\":" +
          "          [" +
          "            {" +
          "              \"id\":\"13\"," +
          "              \"cell\":" +
          "                  [\"13\",\"2007-10-06\",\"Client 3\",\"1000.00\",\"0.00\",\"1000.00\",null]" +
          "            }," +
          "            {" +
          "              \"id\":\"12\"," +
          "              \"cell\":" +
          "                  [\"12\",\"2007-10-06\",\"Client 2\",\"700.00\",\"140.00\",\"840.00\",null]" +
          "            }," +
          "            {" +
          "              \"id\":\"11\"," +
          "              \"cell\":" +
          "                  [\"11\",\"2007-10-06\",\"Client 1\",\"600.00\",\"120.00\",\"720.00\",null]" +
          "            }," +
          "            {" +
          "              \"id\":\"10\"," +
          "              \"cell\":" +
          "                  [\"10\",\"2007-10-06\",\"Client 2\",\"100.00\",\"20.00\",\"120.00\",null]" +
          "            }," +
          "            {" +
          "              \"id\":\"9\"," +
          "              \"cell\":" +
          "                  [\"9\",\"2007-10-06\",\"Client 1\",\"200.00\",\"40.00\",\"240.00\",null]" +
          "            }," +
          "            {" +
          "              \"id\":\"8\"," +
          "              \"cell\":" +
          "                  [\"8\",\"2007-10-06\",\"Client 3\",\"200.00\",\"0.00\",\"200.00\",null]" +
          "            }," +
          "            {" +
          "              \"id\":\"7\"," +
          "              \"cell\":" +
          "                  [\"7\",\"2007-10-05\",\"Client 2\",\"120.00\",\"12.00\",\"134.00\",null]" +
          "            }," +
          "            {" +
          "              \"id\":\"6\"," +
          "              \"cell\":" +
          "                  [\"6\",\"2007-10-05\",\"Client 1\",\"50.00\",\"10.00\",\"60.00\",\"\"]" +
          "            }," +
          "            {" +
          "              \"id\":\"5\"," +
          "              \"cell\":" +
          "                  [\"5\",\"2007-10-05\",\"Client 3\",\"100.00\",\"0.00\",\"100.00\",\"no tax at all\"]" +
          "            }," +
          "            {" +
          "              \"id\":\"4\"," +
          "              \"cell\":" +
          "                  [\"4\",\"2007-10-04\",\"Client 3\",\"150.00\",\"0.00\",\"150.00\",\"no tax\"]" +
          "            }" +
          "          ]," +
          "      \"userdata\":{\"amount\":3220,\"tax\":342,\"total\":3564,\"name\":\"Totals:\"}" +
          "    }";
    }else{
      jsondata = "{" +
          "    \"page\":\"2\"," +
          "    \"total\":2," +
          "    \"records\":\"13\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"3\"," +
          "        \"cell\":[\"3\",\"2007-10-02\",\"Client 2\",\"300.00\",\"60.00\",\"360.00\",\"note invoice 3 & and amp test\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"2007-10-03\",\"Client 1\",\"200.00\",\"40.00\",\"240.00\",\"note 2\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"2007-10-01\",\"Client 1\",\"100.00\",\"20.00\",\"120.00\",\"note 1\"]" +
          "      }" +
          "    ]," +
          "    \"userdata\":{\"amount\":600,\"tax\":120,\"total\":720,\"name\":\"Totals:\"}}";
    }
    response.getWriter().write(jsondata);
  }
}

Detail java servlet代码举例

public class SubGrid extends HttpServlet {
  private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public SubGrid() {
        super();
        // TODO Auto-generated constructor stub
    }

  /**
   * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
   */
  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // TODO Auto-generated method stub
    doPost(request,response);
  }

  /**
   * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
   */
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // TODO Auto-generated method stub
    String id = request.getParameter("id");
    int iId = Integer.parseInt(id);
    String jsondata = "{}";
    switch (iId) {
    case 13:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"1\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 13\",\"1.00\",\"1000.00\",\"1 000.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 12:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 2\",\"1.00\",\"400.00\",\"400.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 4\",\"1.00\",\"300.00\",\"300.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 11:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"4\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 1\",\"2.00\",\"100.00\",\"200.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 2\",\"3.00\",\"50.00\",\"150.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"3\"," +
          "        \"cell\":[\"3\",\"item 3\",\"1.00\",\"50.00\",\"50.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"4\"," +
          "        \"cell\":[\"4\",\"item 4\",\"1.00\",\"200.00\",\"200.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 10:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 4\",\"1.00\",\"70.00\",\"70.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 5\",\"3.00\",\"10.00\",\"30.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 9:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 3\",\"1.00\",\"60.00\",\"60.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 6\",\"1.00\",\"140.00\",\"140.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 8:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"3\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 2\",\"1.00\",\"120.00\",\"120.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 3\",\"1.00\",\"50.00\",\"50.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"3\"," +
          "        \"cell\":[\"3\",\"item 3\",\"1.00\",\"30.00\",\"30.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 7:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 1\",\"1.00\",\"100.00\",\"100.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 5\",\"2.00\",\"10.00\",\"20.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 6:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"1\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 4\",\"1.00\",\"50.00\",\"50.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 5:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"1\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 3\",\"1.00\",\"100.00\",\"100.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 4:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 1\",\"1.00\",\"100.00\",\"100.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 2\",\"1.00\",\"50.00\",\"50.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 3:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 3\",\"1.00\",\"100.00\",\"100.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 4\",\"1.00\",\"200.00\",\"200.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 2:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 1\",\"2.00\",\"20.00\",\"40.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 2\",\"4.00\",\"40.00\",\"160.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    case 1:
      jsondata = "{" +
          "    \"page\":\"1\"," +
          "    \"total\":1," +
          "    \"records\":\"2\"," +
          "    \"rows\":[" +
          "      {" +
          "        \"id\":\"1\"," +
          "        \"cell\":[\"1\",\"item 1\",\"1.00\",\"20.00\",\"20.00\"]" +
          "      }," +
          "      {" +
          "        \"id\":\"2\"," +
          "        \"cell\":[\"2\",\"item 2\",\"2.00\",\"40.00\",\"80.00\"]" +
          "      }" +
          "    ]" +
          "  }";
      break;
    default:
      break;
    }
    
    response.getWriter().write(jsondata);
    
  }

}
杨林伟
关注
  • 3
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jqGrid jsp+servlet+mysql+tomcat 主从表设计实现
04-20
关于jqGrid 前端框架与后台交互及主从表实现的完整实例 如无下载币可访问本人博客 复制源码 http://blog.csdn.net/dfs4df5/article/details/51187065
JQuery实现的主从表关系
yinjianjing的专栏
05-12 3803
源码地址：http://download.csdn.net/source/3215606可以实现主表与从表的关系，例如：一张单据可以由两批货物在页页上显示，都通过JQuery实现.可操作性强也也利于用户体验，其实包含了ajax,xml以及json等方法，JQuery学习的好工具，希望能给大家有所帮助，有错误的请大家批评指证。 
jqgrid主从表查询+添加grid按钮+查询框的“X”取消+查询框去掉
u014187551的专栏
03-27 1832
public function maingrid(){     // jqgrid查询         Vendor('jqSuite.jqGrid');         Vendor('jqSuite.jqGridPdo');         $conn = new PDO(C('GRIDB.DSN'),C('GRIDB.USER'),C('GRIDB.PWD'));         
java grid_Java中jqGrid 学习笔记整理——进阶篇(二)
weixin_29837797的博客
02-12 371
相关阅读：本篇开始正式与后台(java语言)进行数据交互，使用的平台为JDK：java 1.8.0_71myEclisp 2015 Stable 2.0Apache Tomcat-8.0.30Mysql 5.7Navicat for mysql 11.2.5(mysql数据库管理工具)一、数据库部分1、创建数据库使用Navicat for mysql创建数据库(使用其他工具或直接使用命令行暂不介绍...
jqgrid学习笔记
方逸涛的专栏
02-01 1197
一、主要API接口getGridParam、setGridParam： 　　getGridParam方法： 　　getGridParam("url")： 获取当前的AJAX的URL  　　getGridParam("sortname")：排序的字段  　　getGridParam("sortorder")：排序的顺序  　　getGridParam("selrow")：得到选中行
jqgrid 主从表的 实现方法
buhuan123的专栏
05-26 3030
<br />一个页面有 2个 table 一个为主table 而一个为明细table 那么  我们要做的就是 单击 主table 的某一行，明细table 的内容就显示出来。<br />方法如下:<br />需要用到事件<br />onSelectRow: function(id){ <br />       if( id!=null){ <br />          <br />        $("#list2").jqGrid('setGridParam',{url:'servlet/SampleR
html5动态grid 表格,jQuery表格插件bs_grid
weixin_34621186的博客
06-09 434
插件描述：bs_grid是一个jQuery DataGrid插件，基于Bootstrap。先进行选择，排序和过滤，分页。完全可定制的，灵活的网络设计，定位。特点引导创建(bootstrap 2支持)响应的网页设计完全可配置的获得JSON格式的数据(使用Ajax的任何服务器端技术)一个PHP类设置为服务器端操作更改列顺序显示/隐藏列列式简单的点击排序的列灵活的数据排序(多栏)单个或多个行选择强大的分...
jqgrid主从表
u014187551的专栏
03-27 2807
html：                                                                             jQuery(document).ready(function() {         $.ajax({              url: "__URL
EasyUI - 实现DataGrid 主从表显示 DetailView实现方式
weixin_30627381的博客
06-02 393
先上图 技术实现上需要帮助的，请留言 实现原理 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="keywords" content="jquery,ui,easy,easyui,web"&...
jQuery实现的主从表的使用
04-22
可以实现主表与从表的关系，例如：一张单据可以由两批货物在页页上显示，都通过JQuery实现的
jqGrid-5.1.0表格插件.rar
08-30
软件介绍: jqGrid-5.1.0是很好用的jQuery表格插件，支持国际化具有bootstrap风格，通过使用jqGrid能实现前端页面与后台数据的ajax异步通信。
jqGrid-5.1.0
06-01
非常好用的表格插件，还有bootstrap风格，支持国际化。
jqGrid-4.15.2
11-29
jqGrid-4.15.2 基于 jqGrid 分支后的free-jqGrid，支持bootstrap主题
jqGrid-master
08-05
jqGrid-master最新版，从英文站点下载而来，方便各位下载
jquery.jqGrid-4.5.2.zip
07-01
jquery.jqGrid-4.5.2.zip 官方资源文件
27jqGrid 3.0新特征- 数据加载完成回调
阿甘兄
04-24 2696
这个例子演示了jqGrid的两个新功能。 loadComplete() callback -该方法是在执行加载数据后立即执行。 这样我们就可以根据不同的需求来做不同的变化修改。 新方法 getDataIDs() -返回当前加载数据的id列表。 这个方法可以与loadComplete回调方法组合来试用。 HTML代码举例 <html> <head> ...
67jqGrid - 搜索操作工具栏
阿甘兄
04-28 1638
这个例子展示了jqGrid一个非常有用的功能-在工具栏上选择一个特定字段进行搜索操作。 为此，我们引入了一个新的工具栏搜索参数-searchOperators，当我们设置它为true时， 他允许我们在一个特定的字段上选择一个搜索操作。 在例子中，很多不同的操作，已经在搜索操作项里面被定义了。 选择一个期望的操作，填入一个值，然后点击Enter，它将会被搜索。 HTML代码举例 <html&...
29jqGrid 3.0新特征- 显示/隐藏列
阿甘兄
04-24 1323
这个例子展示了两个新方法: 1.hideCol(colname) - 可以根据一个给出的列名来隐藏一列。 2.showCol(colname) - 可以根据给出的列名来显示一列。 3.当表格在初始化中设置了colModel中的一个新属性hidden的时候，我们可以实现隐藏一列。 例如: {name:‘invdate’,index:‘invdate’, width:90, hidden:true} ...
22jqGrid - 多级表格2
阿甘兄
04-24 1094
这个例子展示了用一个表格来作为多级表格。 HTML代码举例 <html> <head> <title>jqGrid 实例</title> </head> <body> ···代码省略··· <table id="listsg11"></table> &lt...
设置 jqgrid表格样式
最新发布
06-06
可以通过以下步骤设置 jqGrid 表格样式： 1. 引入 jqGrid 插件和样式文件。 ``` <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/5.4.0/css/ui.jqgrid.min.css" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/5.4.0/js/jquery.jqgrid.min.js"></script> ``` 2. 在 HTML 页面中添加一个 div 元素作为表格容器。 ``` <div id="grid"></div> ``` 3. 使用 JavaScript 代码初始化 jqGrid 表格并设置样式。 ``` $(function(){ $("#grid").jqGrid({ url: "data.json", datatype: "json", colModel: [ { name: "id", label: "ID", width: 50 }, { name: "name", label: "Name", width: 150 }, { name: "age", label: "Age", width: 50 }, { name: "address", label: "Address", width: 200 } ], rowNum: 10, rowList: [10, 20, 30], pager: "#pager", sortname: "id", viewrecords: true, sortorder: "asc", caption: "Sample Grid" }); $("#grid").jqGrid("navGrid", "#pager", { edit: false, add: false, del: false }); }); ``` 4. 在 CSS 文件中添加样式。 ``` .ui-jqgrid { font-size: 14px; } .ui-jqgrid tr.jqgrow td { padding: 5px; } .ui-jqgrid .ui-jqgrid-hdiv { background-color: #f2f2f2; } .ui-jqgrid .ui-jqgrid-btable { border-collapse: separate; border-spacing: 0px; } .ui-jqgrid .ui-jqgrid-pager { background-color: #f2f2f2; border-top: none; } .ui-jqgrid .ui-jqgrid-pager .ui-pg-table { margin: 0; } .ui-jqgrid .ui-jqgrid-pager .ui-pg-table .ui-pg-button { border: none; margin: 0 5px; } .ui-jqgrid .ui-jqgrid-pager .ui-pg-table .ui-pg-button:hover { background-color: #e6e6e6; } ``` 注意：样式文件中的样式可以根据需要进行修改，以上只是一个示例。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值