jqGrid返回rowObject undefined

Question

我正在使用jqGrid在下面的代碼中顯示我的項目中的訂單，當我嘗試使用網格上的刷新按鈕進行刷新時，列狀態的格式化程序即函數dropdownFormatter（）具有rowObject變量未定義。

由於這一點，當我嘗試一個自動重新加載函數，下拉列表，不要填充適當的參數。如果將jqGrid屬性「loadonce」設置爲false，則可以解決此問題。

但是，如果「loadonce」屬性設置爲false，下拉選擇根本不會過濾網格。

jQuery("#list").jqGrid({ 
       url:'http://192.168.0.7:8000/orders_get_open', 
       datatype: "json", 
       colNames:['Id','Order No','Address', 'Pincode', 'Phone Number', "Pickup Date", "Pickup Time", "Delivery Date", "Delivery Time", "Status", "Delivery Boys", "Actions"], 
       colModel:[ 
        {name: 'order_id', index: 'order_id', hidden: true}, 
        {name: 'order_no', index: 'order_no', width: 130}, 
        {name: 'user_address',index: 'user_address', width: 400, search: false}, 
        {name: 'pincode',index: 'pincode', width: 110, search: false}, 
        {name: 'user_phone_number',index: 'user_phone_number', width: 180, search: false}, 
        {name: 'pickup_date', index: 'pickup_date'}, 
        {name: 'pickup_time', index: 'pickup_time'}, 
        {name: 'delivery_date', index: 'delivery_date', width: 170}, 
        {name: 'delivery_time', index: 'delivery_time', width: 170}, 
        { 
         name: 'status', index: 'status', formatter: statusFormatter, stype: 'select', searchoptions: { 
          sopt: ['eq'], value: ':All;ordered:Ordered;received:Received;laundry_entry:Laundry Entry;laundry_exit:Laundry Exit;delivered:Delivered' 
         } 
        }, 
        {name: 'delivery_boys', index: 'delivery_boys', formatter: dropdownFormatter, search: false}, 
        {name: '', index:'', formatter: actionFormatter, search: false} 
       ], 
       width: "1300", 
       height: "auto", 
       cache: false, 
       rowNum:10, 
       rowList:[10,20,30], 
       pager: '#pager', 
       loadonce: true, 
       sortname: 'id', 
       viewrecords: true, 
       sortable: true, 
       sortname: "order_no", 
       sortorder: "asc", 
       caption:"Order Details",      
      }).jqGrid('navGrid','#pager', { 
       edit:false,add:false,del:false, search: false, refresh: true 
      }).jqGrid('filterToolbar', { 
       stringResult: true, searchOnEnter: false, defaultSearch: "cn" 
      }); 

function dropdownFormatter(cellValue, options, rowObject) { 
      console.info(cellValue, options, rowObject); 
      console.log(rowObject.delivery_boy_id); 

      var control = "<select class='form-control'><option value>Select</option>"; 
      $.each(cellValue, function (idx, obj){ 
       if (obj.id == rowObject.delivery_boy_id) { 
        control += "<option value='" + obj.id + "' selected='selected'>" + obj.name + "</option>"; 
       } else { 
        control += "<option value='" + obj.id + "'>" + obj.name + "</option>";        
       } 
      }); 
      control += "</select>"; 
      return control; 
     } 

的樣本數據：https://api.myjson.com/bins/22vo1

的jsfiddle的代碼：http://jsfiddle.net/76588Lev/1/

Answer 1

您的代碼包含一些小問題的name: ''使用，這是不允許的，隱藏order_id的使用情況，您想要用作您的數據的ID，但是您沒有添加的地方key: true財產或未使用jsonReader: { id: "order_id" }。儘管如此，你的主要問題還有另一個起源jqGrid只讀取和保存本地（由於loadonce: true）輸入數據的屬性，這些屬性用作列。您嘗試使用delivery_boy_id財產，這是未使用在colModel。因此，僅在初始加載期間，值將在rowObject中。

我建議您首先升級到最新的free jqGrid版本：4.13.0。 免費jqGrid是jqGrid的分支，我在版本4.7.1（見the post）更改許可協議之後開發的版本4.7發佈後發佈。產品名稱更名爲Guriddo jqGrid JS。 Guriddo jqGrid JS是紀念品產品（請參閱價格here）與開源。我使用jqGrid 4.7作爲起點，並實施了許多the wiki文章中描述的許多新功能，並且已發佈每個版本的自述文件。免費的jqGrid與舊版本的jqGrid（直到4.7）一樣在相同的許可證（MIT和GPLv2）下提供。

免費的jqGrid的新功能，它可幫助你有以下幾種：

• 你可以通知免費的jqGrid讀取輸入數據的額外屬性並保存有本地。這些屬性將在自定義格式化程序中提供，cellattr和rowattr回調以及稍後的本地數據（使用getLocalRow方法可用）。例如，您可以刪除不需要的隱藏order_id列並添加選項additionalProperties: ["order_id", "delivery_boy_id"]。
• 另外，我建議您添加jsonReader: "order_id"和prmNames: { id: "order_id" }選項來通知jqGrid使用輸入數據的屬性作爲rowid的值（id屬性的值<tr>屬性的網格元素）。
• 將forceClientSorting: true選項另外添加到loadonce: true。它強制本地排序和過濾數據之前顯示第一頁數據。如果從第三方來源或從文件加載數據（如果您無法更改數據的排序順序），該選項非常實用。在使用forceClientSorting: true選項的情況下，您只需添加sortname和sortorder它將指定列名或需要對數據進行排序的附加屬性的名稱。
• 我建議您從所有colModel項目中刪除不需要的index屬性。
• 我看到你在網格中使用Bootstrap和Font Awesome。我建議您使用選項iconSet: "fontAwesome"和guiStyle: "bootstrap"以具有相同的外觀免費jqGrid。如果你想改變一些jqGrid元素的顏色，你只需要添加一些額外的CSS規則。請參閱版本4.13.0的自述文件中的the demo。

由此產生的演示將被修改爲以下內容：http://jsfiddle.net/OlegKi/76588Lev/6/。

我建議你另外考慮用自定義按鈕替換帶有動作按鈕的自定義格式化程序的列到formatter: "actions"。這是免費jqGrid的另一種選擇。你可以在the answer找到更多的細節和相應的演示。