mercredi 18 avril 2018

JqGrid Multiple Search "OR" Operator

I have a table using jqGrid and I get a list of locations "USA","UK","GRM" and I want the multiselect field to let me choose more than one and filter using the OR operator. If I choose USA i want to see only the rows with Location USA and If I choose UK too I want to see USA and UK rows. With this code, It works if i select one but if i select two or more it gives me all the rows in the table.

   $("#jqGrid").jqGrid({
    url: '../Locat/GetList',
    mtype: "GET",
    styleUI: 'Bootstrap',
    datatype: "json",
    rownumbers: true,
    rownumWidth: 44,
    colModel: [
        {
            label: 'rowKey', name: 'Id', key: true, hidden: true, editable: false,
            editrules: { edithidden: true },
            width: 60
        },
        {
            label: 'Location',
            name: 'LocationName', editable: true, editrules: {
                custom: true,
                custom_func: function (value, colName) {
                    return selectBoxRequired(value, colName, "LocationName");
                }
            }, formoptions: {
                colpos: 1,
                rowpos: 1,
                label: 'Location <span style="color:red">(*)</span>'
            },
            edittype: "select", editoptions: {
                dataInit: function (element) {
                    $(element).width('95%').select2({
                        placeholder: "Select location",
                        theme: "classic",
                        tags: false,
                        createTag: function (params) {
                            return {
                                id: params.term,
                                text: params.term,
                                newOption: false
                            }
                        },
                        templateResult: function (data) {
                            var $result = $("<span></span>");

                            $result.text(data.text);

                            if (data.newOption) {
                                $result.append(" <em>(new)</em>");
                            }

                            return $result;
                        }
                    }).on("select2:close", function () {
                        // fired to the original element when the dropdown closes
                        $(element).focus();
                    });
                },
                edithidden: false,
                dataUrl: "../ApiC/getLocations",
                cacheUrlData: true,
                buildSelect: function (data) {
                    var data = data.split(";"), i = 0, len = data.length, s = '<select>', d;
                    while (i < len) {
                        d = data[i].split(":");
                        s += '<option value="' + d[0] + '">' + d[1] + '</option>';
                        i++;
                    }
                    s += '</select>';
                    return s;
                }
            }, width: 80,
            stype: "select",
            searchoptions: { value: filterLocationString, clearSearch: false, sopt: ["eq"], multiple: true, sFilter:{"groupOp": "OR"} },
            classes: "frozee"
        }




Aucun commentaire:

Enregistrer un commentaire