• jqGrid API 相关


    取消所有选中的行:

    $("jqgridtableid").trigger("reloadGrid");

    设定选中行,可设定多行选中:

    $("jqgridtableid").jqGrid('setSelection',id1);

    $("jqgridtableid").jqGrid('setSelection',id2);

    获得选中行的ID数组:

    var ids = $("jqgridtableid").jqGrid('getGridParam','selarrrow');

    获得某单元格的数据:

    var celldata = $("jqgridtableid").jqGrid('getCell',id,colnum);

    获得所有行的ID数组:

    var ids =  $("jqgridtableid").jqGrid('getDataIDs');

    获取jqGrid中选择的行的数据

    如何获取jqGrid中选择的行的数据?

    下面可以获取选择一行的id,如果你选择多行,那下面的id是最后选择的行的id:

    var id=$(‘#gridTable’).jqGrid(‘getGridParam’,'selrow’);

    如果想要获取选择多行的id,那这些id便封装成一个id数组,那可以使用以下:

    var ids=$(‘#gridTable’).jqGrid(‘getGridParam’,'selarrrow’);

    如果想获取选择的行的数据,只要传入rowId即可,如下:

    var rowData = $(“#gridTable”).jqGrid(‘getRowData’,rowId);

    而这个rowData是一个对象,如果要获取选择的行的这个对象的属性值,如name的值,需如下:

    var rowName=rowData.name;

    当然你这个对象得有name这个属性才行。

    应用实例:

    var ids=$("#rightGrid9").jqGrid("getGridParam","selarrrow");
    if(ids.length==1){
    var rowid=$("#rightGrid9").jqGrid("getGridParam","selrow");
    $("#rightGrid9").panGrid("downlayer",{"rowid":rowid});
    }else{
    alert("你没有选取或者选取为多行数据,不允许进入下一级");
    }

    核心提示:本文主要讲述subGrid(子数据表格)-jqGrid中文API(4)相关内容:JQgrid 中文api比较零散,嗨网在线 将陆续收集网上大虾翻译过的api,供各位需要的朋友参考,本篇jqGrid中文API主要介绍options ColModel(选项和列设置),jqgrid提供的所谓subgrid就是在我们每一条所选中记录下面在出现一个数据表格。

    1. subgrid安装
    2. 属性
    3. 事件:
    4. 方法:

    JQgrid 中文api比较零散,嗨网在线 将陆续收集网上大虾翻译过的api,供各位需要的朋友参考,主要包括subGrid(子数据表格)Navigator Pager(导航分页)Events(事件)options ColModel(选项和列设置)。higrid.net上提供的本篇jqGrid中文API主要介绍options ColModel(选项和列设置),jqgrid提供的所谓subgrid就是在我们每一条所选中记录下面在出现一个数据表格(如图),里面的内容都是这条父记录的子记录。jqGrid提供了两种处理子记录的方法:subGrid方法和将一个grid作为subGrid

    subgrid安装

    确保你下载的`jqGrid`的js包中含有`grid.subgrid.js`组件

    属性

    下列的属性请在grid的options(选项)中使用--注:详见options ColModel(选项和列设置)

    属性 类型 描述 默认值
    subGrid boolean 若使用subgrid功能将此属性设置为true,此时在基本的Grid左侧会出现额外的显示加号图标的一列,表明用户可以点击加号展开该行显示subgrid数据,默认所有行是收缩的。 false
    subGridOptions object 一组对subgrid设置的属性,默认所有属性使用下列的默认值{
    plusicon : “ui-icon-plus”,
    minusicon : “ui-icon-minus”,
    openicon: “ui-icon-carat-1-sw”,
    expandOnLoad: false,
    selectOnExpand : false,
    reloadOnExpand : true
    }
    plusicon and minusicon定义收缩和展开时的图标样式,名称必须符合Theme Roller的规范openicon当subgrid展开时minusicon下面的图标样式expandOnload为真时当数据装载时所有行自动展开selectOnLoad为真时当鼠标点击加号图标该行处于选中状态reloadOnExpand 为假时subgrid中的数据只装载一次,随后的点击仅仅显示隐藏数据并不会有ajax交互。
     
    subGridModel array 这是一组描述subgrid列属性和subgrid数据的数组,只有当subGrid为真才生效,语法如:
    subGridModel : [
    {
    name : ['name_1','name_2',…,'name_n'],
    width : [width_1,width_2,…,width_n] ,
    align : ['left','center',…,'right'] ,
    params : [param_1,…,param_n],
    mapping:['name_1_map','name_2_map',…,'name_n_map']}
    ]
    name: 包含列去标签索引(labels)的数组
     包含列宽度的数组,个数要与name中的一致
    align: 包含列中文字对齐状态的数组,值可为left、center、right,默认left
    params: 类型数组,默认只将行id传给服务端,可以添加一个额外的参数传给服务端,名称可以是colModel中的name属性值
    mapping:当repeateditems为false才可用,我们用name映射subgrid中的name,
     
    subgridtype mixed 装入subgrid的数据类型。默认按父grid中的数据类型 null
    subGridWidth integer 设置subgrid列的宽度 true
    subGridUrl string 当subGrid属性为真才有效,获取subgrid数据的路径,jqGrid将行的ID增加此url中,若要添加其他参数,使用subGridModel  
    ajaxSubgridOptions
    object
    设置ajax的全局属性作用于当subgrid获得数据时,会覆盖当前ajax的所有设置,包括完成事件 0

    在配置subgrid前你需要先在xmlReader或jsonReader中配置subgrid项,默认的设置是

     xmlReader : {

    subgrid: {
    root: “rows”,
    row: “row”,
    repeatitems: true,
    cell: “cell”
    }
    }
    jsonReader : {

    subgrid: {
    root: “rows”,
    repeatitems: true,
    cell: “cell”
    }
    }

    映射规则与基本grid中的相同,了解更多jqGrid中文文档(3)–数据操作

    下面是一个subGridType从服务端获取的例子

    jQuery("#grid_id").jqGrid({
    ...
       subgridtype: function(rowidprm) {
          jQuery.ajax({
             url:'url_to_the_service',
             data:rowidprm,
             dataType:"json",
             complete: function(jsondata,stat){
                if(stat=="success") {
                   var thegrid = jQuery("#grid_id")[0];
                   thegrid.subGridJson(eval("("+jsondata.responseText+")"),rowidprm.id);
                }
             }
          });
       },subgrid

    rowidprms是一个包含行id和其他参数的数组,作为需要来设置subGridModel的参数和subGridJson方法

    事件:

    pID:点击行时会创建子表格subGrid,是个div元素,它的id就是pID
    id:要展开行显示子表格的行id
    sPostData:当subgrid响应时发布的数据

    事件 参数 描述
    subGridBeforeExpand pID,id 展开grid前触发,事件应返回false或true,当返回false,subgrid中的行不会被展开也不会打开。
    subGridRowExpanded pID,id subgrid生效并且点击展开加号图标钮时触发,可以在subgrid中设置自定义数据
    subGridRowColapsed pID,id 当点击收缩图标时触发,事件应返回false或true;当为false行不会收缩。
    serializeSubGridData pID,id 此事件被用作经过ajax响应后初始化数据,需返回初始化的数据(XML、JSON等格式)

    方法:

    事件 参数 描述
    subGridBeforeExpand pID,id 展开grid前触发,事件应返回false或true,当返回false,subgrid中的行不会被展开也不会打开。
    subGridRowExpanded pID,id subgrid生效并且点击展开加号图标钮时触发,可以在subgrid中设置自定义数据
    subGridRowColapsed pID,id 当点击收缩图标时触发,事件应返回false或true;当为false行不会收缩。
    serializeSubGridData pID,id 此事件被用作经过ajax响应后初始化数据,需返回初始化的数据(XML、JSON等格式)

    禁用/启用 subgrid:

  • 相关阅读:
    在Xsheel Linux上安装nodejs和npm
    判断js中的数据类型的几种方法
    Sequelize 中文API文档-1. 快速入门、Sequelize类
    php中 ob_start()有什么作用
    PHP错误类型及屏蔽方法
    ajax对象的获取及其常用属性
    linux工作笔记
    Redis和Memcached的区别
    MySQL架构
    Http协议三次握手过程
  • 原文地址:https://www.cnblogs.com/MonaSong/p/5109625.html
Copyright © 2020-2023  润新知