CODEWITHSUNDEEP
javascriptjqueryjqgrid
birdy
birdy

Reputation: 9636

reloading dataurl elements in 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'}}
    ]
});

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.

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.

The someurl.htm returns <select> <option val=''>something</option></select>

Upvotes: 3

Views: 1956

Answers (1)

Oleg
Oleg

Reputation: 221997

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.

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:

enter image description here

The corresponding code is below:

$("#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"});
});

Upvotes: 3

Related Questions