【问题标题】:JqGrid select particular row which may or may not be visibleJqG​​rid 选择可能可见或不可见的特定行
【发布时间】:2012-09-06 16:03:06
【问题描述】:

我有一个 jqGrid 并且有几页项目。我有一行的 ID,它可能在第一页上,也可能埋在其他页面的某个地方。

给定行的 ID,我如何以编程方式选择这样的行?我正在使用一个按钮的点击事件如下

.on("click", function(){
     var myId = $(this).attr("id");
     $("#studentGrid").jqGrid.setSelection(myId, true);
});

当我点击按钮时,我会在萤火虫控制台中看到以下内容。

TypeError:this.each 不是函数

有什么想法吗?

编辑
所以我选择只用一条记录重新填充网格。问题是我没有使用本地数据。我的数据类型是“json”。像这样

  $("#studentGrid").jqGrid({
                url: '<c:url value="/students/studentjsondata"/>',
                datatype: 'json',
                height: 'auto',
                colNames:['id','First Name', 'Last Name', 'Other Name' ,'Date Of Birth', 'Gender'], 
                colModel:[ 
                        //Bla Bla Bla
                ],
                rowNum:10,
                autowidth: true,
                pager: '#pager', 
                sortname: 'id', 
                viewrecords: true, 
                sortorder: "desc",
                caption:"Students",
                emptyrecords: "Empty Records",
                subGrid: true,
                /* <![CDATA[ */ 
                onSelectRow: function(id){ 
                    if((lastsel != 0)&&(id!==lastsel)){ 
                        $("#studentGrid").jqGrid('collapseSubGridRow', lastsel);                
                    } 
                    lastsel=id; 
                }/* ]]> */ ,
                subGridOptions: { 
                    "plusicon" : "ui-icon-triangle-1-e", 
                    "minusicon" : "ui-icon-triangle-1-s", 
                    "openicon" : "ui-icon-arrowreturn-1-e", 
                    "reloadOnExpand" : true, 
                    "selectOnExpand" : true  
                },
                subGridRowExpanded: function(subgrid_id, row_id) {
                    //Bla Bla Bla
                }
    });

我有想要重新填充网格的 json 字符串。如何使用这些新数据重新初始化网格。我下面的json字符串对应的逻辑如下,但是什么也没发生。

{'page':'1', 'records':'1', 'total':'1', 'rows':[{'id':'7385', 'cell': ['Max', 'Payne', '', 'September 16, 2012', 'Male']}]}


.on("click", function(){
  var myNewData = eval('(' + $(this).attr("griddata") + ')');
  $("#studentGrid").jqGrid('setGridParam', { datatype: 'local', data: myNewData}).trigger('reloadGrid');
 });    

【问题讨论】:

  • 所有数据都加载一次?即loadOnce = true?
  • 不,我在创建网格时没有指定该选项。因此,如果记录隐藏在其他页面中,它可能不一定存在......嗯?可能我将不得不仅使用这一条目搜索并重新填充网格。

标签: jquery jqgrid jqgrid-asp.net jqgrid-php


【解决方案1】:

各位,谢谢大家的cmets。他们引导我回答这个问题。这个link 也很有帮助。所以这是使用 json 字符串更新非本地数据的代码。

.on("click", function(){
    $("#studentGrid").jqGrid('setGridParam', { jsonReader: { repeatitems: false }, datatype: 'jsonstring', datastr: $(this).attr("griddata")}).trigger('reloadGrid');
});

希望它可以帮助那里的其他人。现在我要做的就是弄清楚如何通过删除这些参数来正确地重新加载网格。这是通过使用默认的 jsonReader 来完成的,如下所示。

$("#studentGrid").jqGrid('setGridParam', {    jsonReader : {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: true,
cell: "cell",
id: "id",
userdata: "userdata",
subgrid: {root:"rows", 
repeatitems: true, 
cell:"cell"
 }
} , datatype: 'json', datastr: null});

【讨论】:

  • 抱歉,哪个关系可以回答您的原始问题:以编程方式选择由 id 标识的行?
【解决方案2】:

您可以尝试在$("#studentGrid") 网格的loadComplete 内添加调用setSelection 方法:

loadComplete: function () {
    $(this).jqGrid("setSelection", myId, true);
}

如果 id 等于 myId 的行不在当前页面上,则不会选择任何行。如果 id = myId 的行在当前页面上执行,则该行将被选中。是你想要的吗?

【讨论】:

  • 嗨 Oleg,有没有办法通过 id 选择不在当前页面上的行?这样当我们导航到该页面时,该行就会被选中。
  • @keithxm23:只能选择现有行,因此当前页面上的行。尽管如此,回调loadComplete 将在每个页面加载后执行。因此,如果您有$(this).jqGrid("setSelection", myId, true);,那么如果存在myId 行,则将在当前(第二个)页面上选择它。
  • @Rahul:顺便说一句,可以在免费的 jqGrid 和 jqGrid 的最新版本中使用deselectAfterSort: true 选项。它目前仅适用于datatype: "local"。设置deselectAfterSort: true 获取有关从selarrrow 数组(在使用multiselect: true 的情况下)或selrow 中选择行的信息,并在填充网格体期间选择指定的行。可以使用该方式作为loadComplete 中使用setSelection 的替代方案的基础。我想过在下一版本的免费 jqGrid 中删除对datatype: "local" 的测试。
【解决方案3】:

我只是在这里猜测 -

  1. 如果您已经有了需要选择的 ID,为什么不将其保存在内存中呢?或者可能是 cookie 或 HTML5 locaStorage?

  2. 然后使用这些值将选定的行设置为相关行出现在当前页面中的时间。

  3. 您始终可以在页面请求之间来回序列化您的“选定 ID”(如果不使用 ajax)

【讨论】:

    【解决方案4】:

    您只能选择当前页面上的一行。

    您可以将选定的行存储在一个数组(或其他一些数据结构)中,并在更改页面时选择任何“选定”行 - 这个答案应该会有所帮助:jqGrid: How to use multiselect on different pages

    或者,您也可以按照您的建议进行操作,只显示一行,具体取决于您的要求。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2014-02-12
      • 2015-11-05
      • 1970-01-01
      • 2015-04-02
      • 1970-01-01
      • 2011-07-02
      • 1970-01-01
      相关资源
      最近更新 更多