Remove search operator (AND/OR) in multiplesearch

问题:

I need to hide the operator in the search popup, but I cannot get it to work. I tried this, but both operators still appear:

jQuery("#grilla").navGrid("#paginador",
{del:false,add:false,edit:false},{},{},{},{
groupOps: [{ op: "OR", text: "any" }], multipleSearch:true});

Any ideas? Thanks!

回答1:

There are no option which can directly do what you need. Moreover if you would hide the ADD/OR operand from the searching dialog at the dialog initialization (for example inside of beforeShowSearch event handler) with $('select.opsel').hide() the select element will be hidden only at the beginning. After the user click on any button the dialog contain will be repaint without calling of any event handler and the select element will be again visible.

So I suggest to solve the problem with overwriting the method reDraw of the filter dialog. The code which do this can look like

jQuery("#grilla").jqGrid("navGrid","#paginador",
    {del: false, add: false, edit: false}, {}, {}, {},
    {
        multipleSearch: true,
        beforeShowSearch: function($form) {
            var searchDialog = $form[0],
                oldrReDraw = searchDialog.reDraw, // save the original reDraw method
                doWhatWeNeed = function () {
                    // hide the AND/OR operation selection
                    $('select.opsel', searchDialog).hide();

                    setTimeout(function () {
                       // set fucus in the last input field
                       $('input[type="text"]:last', searchDialog).focus();
                    }, 50);
                }
            searchDialog.reDraw = function () {
                oldrReDraw.call(searchDialog);    // call the original reDraw method
                doWhatWeNeed();
            }
            doWhatWeNeed();
        }
    }
);

You can see on the demo that the way really works.

UPDATED: After writing of the answer I posted some suggestions to trirand to improve jqGrid. Now jqGrid has many features which simplify the above work. For example there are exist afterRedraw callback which can be directly used. So the code from the answer will look like

grid.jqGrid("navGrid", "#pager",
    {add: false, edit: false, del: false}, {}, {}, {},
    {
        multipleSearch: true,
        afterRedraw: function (p) {
            var $form = $(this);
            $form.find("select.opsel").hide();
            setTimeout(function () {
               // set fucus in the last input field
               $form.find('input[type="text"]:last').focus();
            }, 50);
            $form.find("input.add-rule,input.delete-rule").button();
        }
    }
);

See the modified demo here:

I added one more line in the code of afterRedraw

$form.find("input.add-rule,input.delete-rule").button();

only to improve the look of buttons in the Searching Dialog. I suggested to make such settings default in jqGrid, but this was not accepted by trirand. In any way everyone who includes jQuery UI can add such line in afterRedraw to make the buttons flat.

回答2:

The accepted answer didn't work for me with 4.4.0.

Much simpler seems to be to hook the afterRedraw event and remove the opsel select element:

jQuery("#grilla")jqGrid(
    "navGrid","#paginador", {del:false,add:false,edit:false},{},{},{},
    {
        multipleSearch:true,
        afterRedraw: function($p) { 
            $("select.opsel").remove(); 
        }
    }
);

回答3:

see here !

 //own add edit del search 
        jQuery("#gridTable3").jqGrid('navGrid', '#gridPager3',
        {
        //options
        },
        {
            // edit options
            height: 250,
            reloadAfterSubmit: false,
            closeAfterEdit: true,
            afterSubmit: function(r, data) {
                var messageString = r.responseText;
                var mesObj = eval('(' + messageString + ')');
                return [mesObj.state, mesObj.message];
            }
        },
        {
            // add options
            height: 250,
            reloadAfterSubmit: false,
            closeAfterAdd: true,
            afterSubmit: function(r, data) {
                var messageString = r.responseText;
                var mesObj = eval('(' + messageString + ')');
                return [mesObj.state, mesObj.message];
            }
        },
         {
             // del options
             reloadAfterSubmit: false,
             closeAfterDel: true,
             afterSubmit: function(r, data) {
                 var messageString = r.responseText;
                 var mesObj = eval('(' + messageString + ')');
                 return [mesObj.state, mesObj.message];
             }
         },
        {
            // search options
            multipleSearch: true,//more search  write there,don't pop
            afterSubmit: function(r, data) {
                var messageString = r.responseText;
                var mesObj = eval('(' + messageString + ')');
                return [mesObj.state, mesObj.message];
            }
        });