javascript - 在multiplesearch jqGrid中删除搜索运算符（AND/OR）

Question

我需要在搜索弹出窗口中隐藏运算符，但我无法让它工作。我试过这个，但两个运算符仍然出现：

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

有任何想法吗？谢谢！

Answer 1

没有选项可以直接做你需要的。此外，如果您在对话框初始化时（例如在beforeShowSearch事件处理程序内部）从搜索对话框中隐藏 ADD/OR 操作数，$('select.opsel').hide()则选择元素将仅在开头隐藏。在用户单击任何按钮后，对话框包含将被重新绘制而不调用任何事件处理程序，并且选择元素将再次可见。

所以我建议通过覆盖过滤器对话框的方法reDraw来解决问题。执行此操作的代码看起来像

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

您可以在演示中看到这种方式确实有效。

更新：在写完答案后，我向 trirand 发布了一些改进 jqGrid 的建议。现在 jqGrid 有许多功能可以简化上述工作。例如，存在afterRedraw可以直接使用的回调。所以答案中的代码看起来像

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

在此处查看修改后的演示：

我在代码中又添加了一行afterRedraw

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

只是为了改善搜索对话框中按钮的外观。我建议在 jqGrid 中将此类设置设为默认值，但这并未被 trirand 接受。无论如何，每个包含 jQuery UI 的人都可以添加这样的行afterRedraw来使按钮变平。

Answer 2

看这里 ！

 //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];
            }
        });

Answer 3

接受的答案对我来说不适用于 4.4.0。

似乎更简单的是挂钩 afterRedraw 事件并删除 opsel 选择元素：

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