JQGrid - 如何在导航中创建复选框以触发Multiselect或SingleSelect

Question

function bind_single_select() {
  if (!$("input#single").length > 0) {
    $("span.single_select").prepend("<input type='checkbox' name='single' id='single' checked='checked' style='vertical-align:middle' />");
  }
  $("table#gridTable").find("tr").click(function () {
    if ($("input#single").attr("checked")) {
      $(".trSelected").removeClass("trSelected");
      $(this).addClass("trSelected");
    }
  });
}

我在Flexigrid中找到了这个，但是在JQGrid中我怎么能这样做。

另一个问题：

.navButtonAdd('#pager',
              { caption: "Add",
                buttonimg: "/Areas/Pages/Content/Images/add.png",
                onClickButton: function () {
                    PopupCenter('<%= Url.Action("CreatePublisher","Publisher") %>',
                                'CreatePublisher', '500', '300');
                }, position: "last"
              })

即使我使用buttonimg也不起作用 UI图标加

先谢谢。

Answer 1

问题的第二部分很容易回答。 buttonimg函数不再支持参数navButtonAdd。您应该使用buttonicon代替。您可以找到here的示例。一般来说，buttonicon的值为jQuery UI Framework Icons，您可以使用demo中的任意值。

要切换multipleSearch参数，您只需单独定义navGrid的搜索参数，然后切换multipleSearch属性的值即可。为了更加轻松，我建议使用其他参数recreateFilter:true。

var grid = jQuery('#list');
var pSearch = { multipleSearch:false, recreateFilter:true };
grid.jqGrid({
    // all jqGrid parameters
}).jqGrid ('navGrid', '#pager', {edit:false, add:false, del:false, refresh:true, view:false},
           {},{},{},pSearch));

$("#pager_left table.navtable tbody tr").append ( // here 'pager' part or #pager_left is the id of the pager
    '<td><div><input type="checkbox" class="myMultiSearch" id="navMultiSearch"/>Multi-Search</div></td>');
$(".myMultiSearch").change(function() {
    if ($(this).is(':checked')) {
        pSearch.multipleSearch = true;
        $(".myMultiSearch").attr("checked","checked");
    }
    else {
        pSearch.multipleSearch = false;
        $(".myMultiSearch").removeAttr("checked");
    }
});

在小{{3}}上，我将内部和外部复选框同时插入导航栏和自定义按钮：