CODEWITHSUNDEEP
javascriptjquerysearchjqgrid
sarsnake
sarsnake

Reputation: 27703

jqGrid colModel dynamic Searchoptions

Is it possible to have a dynamic (not hard coded) search filter values for the jqGrid column?

So in the example such as:

 $('#my-grid').jqGrid({
            datatype: 'json',
            loadonce: true,
            jsonReader: common.jqgrid.jsonReader('Workorder'),
            mtype: 'POST',
            colNames: ['Project', 'PO Number', 'Type', 'Folder'],
            colModel: [
                { name: 'Project', index: 'Project', width: 80, sortable: false, search:false},
                { name: 'PONumber', index: 'PONumber', width: 60, sortable: false, search: true },
                { name: 'Type', index: 'Type', width: 60, sortable: false, search: true},
                { name: 'Folder', index: 'Folder', width: 60, sortable: false, search: false },
                           ],
            scroll: true,
                   });

I would like the type to have a drop down filter with values that are array of distinct values from the data subset coming back.

How would I achieve this?

Edit

Is the jqGrid data accessible directly? I am looking for something like Data.Cols[2].Distinct that will give me the distinct array of values from column 3(in this case). Is this possible?

Edit 2

This is the code:

onLoadComplete: function (data) {
        var $this = $('#gridReport');

        if ($this.jqGrid("getGridParam", "datatype") === "json") {
           
            // first loading from the server
            // one can construct now DISTINCT for 'Type' column and
            // set searchoptions.value
            $this.jqGrid("setColProp", "Type", {
                stype: "select",
                searchoptions: {
                    value: buildSearchSelect(getUniqueNames("Type")),
                    sopt: ["eq", "ne"]

                }
            });            
        }
    },

Upvotes: 2

Views: 7721

Answers (2)

sarsnake
sarsnake

Reputation: 27703

This is how I ended up doing it, I ended up using jquery to populate the drop down directly, as jqgrid filters were not available at any point (if they are, I would love to see a documented example):

 onLoadComplete: function (data) {

        if ($('#mygrid').jqGrid("getGridParam", "datatype") === "json") {

            //get the distinct types from the data set coming back
            var length = data.length;
            var types = [];

            for (var i = 0; i < length; i++) {
                types.push(data[i]['Type']);
            }

            var uniqueTypes = getUnique(types);

            $('#gridId select[name="Type"]').empty().html('<option value="">All</option>');

            for (var i = 0; i < uniqueTypes.length; i++) {
                  $('#gridId select[name="Type"]').append($('<option value="' + uniqueTypes[i] + '">' + uniqueTypes[i] + '</option>'));
            }
        }

Upvotes: 0

Oleg
Oleg

Reputation: 221997

I'm not sure that I understand you correctly. Probably you want to use advanced searching dialog with dropdown (stype: 'select') with different values of the 3-d column of the grid? I would recommend you to read the answer which shows the main idea how one can set searchoptions.value dynamically. You use loadonce: true. So you can call setColProp inside of loadComplete at the first loading of data from the server. You can include additional testing for the value of datatype. At the loading from the server the value is "json". Later it will be changed to "local". So the code could be about the following:

loadComplete: function () {
    var $this = $(this);

    if ($this.jqGrid("getGridParam", "datatype") === "json") {
        // first loading from the server
        // one can construct now DISTINCT for 'Type' column and
        // set searchoptions.value
        $this.jqGrid("setColProp", "Type", {
            stype: "select",
            searchoptions: {
                value: buildSearchSelect(getUniqueNames("Type")),
                sopt: ["eq", "ne"]
            }
        });
    }
}

Upvotes: 3

Related Questions