在 jqGrid 中重新加载 dataurl 元素

2022-01-19 00:00:00 jquery javascript jqgrid

我有一个带有以下选项的简单网格:

I have a simple grid with the following options:

jQuery("#mygrid").jqGrid({
   url: 'dataurl.htm',
   datatype: 'json',
   ajaxSelectOptions: { cache: false }
   ...
   colModel: [
    { name: 'foo', index: 'foo', width: 25, stype: 'select', searchoptions:{ sopt:       
     ['eq'], dataUrl: 'someurl.htm?columnName=foo'}}
    ]
});

但是，当我调用 $("#mygrid").trigger("reloadGrid"); 时，它只从 dataurl.htm 加载表的数据，但是它不会从 some url.htm 链接加载 foo 列的数据.

However, when I call $("#mygrid").trigger("reloadGrid"); it only loads the data for the table from dataurl.htm but it does not load the data for the foo column from the some url.htm link.

我在 SO 上阅读了几个类似的问题，建议使用 ajaxSelectOptions: { cache: false } 但这对我不起作用.

I've read couple of questions like these on SO and it was suggested to have ajaxSelectOptions: { cache: false } but this is not working for me.

someurl.htm 返回 <select><option val=''>something</option></select>

推荐答案

绝对正确的问题！jqGrid 目前的实现只有toggleToolbar 方法可以隐藏工具栏，但工具栏本身会被创建一次.因此工具栏的所有属性始终保持不变.

It's absolutely correct question! The current implementation of jqGrid has only toggleToolbar method which can hide the toolbar, but the toolbar itself will be created once. So all properties of the toolbar stay unchanged the whole time.

为了解决这个问题，我编写了一个非常简单的附加方法 destroyFilterToolbar:

To fix the problem I wrote small additional method destroyFilterToolbar which is pretty simple:

$.jgrid.extend({
    destroyFilterToolbar: function () {
        "use strict";
        return this.each(function () {
            if (!this.ftoolbar) {
                return;
            }
            this.triggerToolbar = null;
            this.clearToolbar = null;
            this.toggleToolbar = null;
            this.ftoolbar = false;
            $(this.grid.hDiv).find("table thead tr.ui-search-toolbar").remove();
        });
    }
});

演示使用该方法.更改某些列的属性后，可以重新创建搜索工具栏.在下面的代码中，可以从搜索工具栏中更改某些文本的语言:

The demo uses the method. One can recreate searching toolbar after changing of properties of some columns. In the code below one can change the language of some texts from the searching toolbar:

对应的代码如下:

$("#recreateSearchingToolbar").change(function () {
    var language = $(this).val();

    // destroy searching toolbar
    $grid.jqGrid("destroyFilterToolbar");

    // set some searching options
    $grid.jqGrid("setColProp", "closed",
        language === "de" ?
                {searchoptions: {value: ":Beliebig;true:Ja;false:Nein"}} :
                {searchoptions: {value: ":Any;true:Yes;false:No"}});
    $grid.jqGrid("setColProp", "ship_via",
        language === "de" ?
                {searchoptions: {value: ":Beliebig;FE:FedEx;TN:TNT;IN:Intim"}} :
                {searchoptions: {value: ":Any;FE:FedEx;TN:TNT;IN:Intim"}});

    // create new searching toolbar with nes options
    $grid.jqGrid("filterToolbar", {stringResult: true, defaultSearch: "cn"});
});

相关文章