jqgrid搜索工具欄不會彈出使用jquery.jqgrid.js

我試圖添加搜索欄與jquery.jqgrid.js後嘗試幾種方法這種方法是唯一一個沒有給我一個錯誤，但也沒有它顯示我的搜索工具欄，可以有人看看，看看我是否失去了什麼？jqgrid搜索工具欄不會彈出使用jquery.jqgrid.js

jQuery(document).ready(function() { 
    jQuery("#list").jqGrid({ 
     url: '/Home/DynamicGridData/', 
     datatype: 'json', 
     mtype: 'POST', 
     colNames: ['Edit', 'AlertId', 'Policy', 'PolicyRule', 'Alert Status', 
        'Alert Code', 'Message', 'Category'], 
     colModel: [ 
     { name: 'Edit', edittype: 'select', formatter: 'showlink' }, 
     { name: 'AlertId', index: 'AlertId', sortable: true, sorttype: 'int', 
     autoFit: true, align: 'left', hidden: true }, 
     { name: 'Policy', index: 'Policy.Name', sortable: true, sorttype: 'text', 
     autoFit: true, searchoptions: { sopt: ['eq', 'ne', 'cn'] }, 
     align: 'left' }, 
     { name: 'Policy Rule', index: 'PolicyRule', sortable: true, 
     sorttype: 'text', autoFit: true, sorttype: 'text', 
     searchoptions: { sopt: ['eq', 'ne', 'cn'] }, align: 'left' }, 
     { name: 'Alert Status', index: 'AlertStatus.status', sortable: true, 
     sorttype: 'text', searchoptions: { sopt: ['eq', 'ne', 'cn'] }, 
     autoFit: true, align: 'left' }, 
     { name: 'Alert Code', index: 'Code', sortable: true, sorttype: 'text', 
     align: 'left', searchoptions: { sopt: ['eq', 'ne', 'cn'] }, 
     autoFit: true }, 
     { name: 'Message', index: 'Message', sortable: true, sorttype: 'text', 
     align: 'left', searchoptions: { sopt: ['eq', 'ne', 'cn'] }, 
     autoFit: true }, 
     { name: 'Category', index: 'Category.name', sortable: true, 
     sorttype: 'text', align: 'left', autoFit: true, 
     searchoptions: { sopt: ['eq', 'ne', 'cn'] }}], 
     pager: $("#pager"), 
     rowNum: 10, 
     rowList: [10, 60, 100], 
     scroll: true, 
     sortname: 'AlertId', 
     sortorder: 'asc', 
     viewrecords: true, 
     imgpath: '/scripts/themes/basic/images', 
     caption: 'my name', 
     gridComplete: function() { 
      var objRows = $("#list tr"); 
      var objHeader = $("#list.jqgfirstrow td"); 
      if (objRows.length > 1) { 
       var objFirstRowColumns = $(objRows[1]).children("td"); 
       for (i = 0; i < objFirstRowColumns.length; i++) { 
        $(objFirstRowColumns[i]).css("width", 
               $(objHeader[i]).css("width")); 
       } 
      } 
     } 
    }); 
}); 

$("#list").jqGrid('navGrid','#pager', 
        {edit:true,add:true,del:true,search:true,refresh:true}); 
$("#list").jqGrid('navButtonAdd',"#pager", 
        {caption:"Toggle",title:"Toggle Search Toolbar", 
        buttonicon :'ui-icon-pin-s',   
        onClickButton:function() {     
         $("#list")[0].toggleToolbar() 
        } }); 
$("#list").jqGrid('navButtonAdd',"#pager", 
        { caption: "Clear", title: "Clear Search", 
        buttonicon :'ui-icon-refresh', 
        onClickButton:function(){     
         $("#list")[0].clearToolbar() 
        } }); 
jQuery("#list").jqGrid('filterToolbar');

來源

2011-03-29 Sue

你的代碼的人能看到你的主要錯誤格式的完善的售後服務：你叫navGrid，navButtonAdd和filterToolbar外jQuery(document).ready。如果您將其移動到jQuery(document).ready內，您將立即看到搜索工具欄：請參見here。

你的代碼有其他的小問題：

變量i內gridComplete應該被聲明爲本地而不是全局變量。
您應該刪除不推薦使用的參數imgpath。
使用colModel參數的許多選項，其默認值爲sortable:true,sorttype: 'text',align: 'left'等。它只會使代碼更長，更慢，更難以閱讀。我建議您查看the part of documentation，其中描述了colModel參數並刪除默認屬性。
您使用的sorttype屬性在使用情況下不起作用datatype: 'json'沒有loadonce:true。因此，您應該決定使用基於服務器的排序，分頁和過濾/搜索，並且您應該在sorttype屬性中更好地刪除，或者應該使用loadonce:true，但是應在第一次請求服務器時立即加載網格包含。
有沒有autoFit列屬性。

來源

2011-03-30 20:40:37 Oleg

jqgrid搜索工具欄不會彈出使用jquery.jqgrid.js

回答

相關問題