reloading dataurl elements in jqGrid

Question

I have a simple grid with the following options:

jQuery(\"#mygrid\").jqGrid({
   url: \'dataurl.htm\',
   datatype: \'json\',
   ajaxSelectOptions: { cache:          


        

Answer 1

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:

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