在分組

Question

使用formatDisplayField我有3列（訂單類型，訂單號，賬單號），我的分組通過，我使用formatDisplayField一個鏈接/按鈕添加到如此，點擊後打開一個上下文菜單，將每一組文本允許我的用戶將子組添加到該組。我需要傳遞與該組有關的直接行數據。現在我正在做一些有趣的事情，數據不夠具體。

實施例：

用戶點擊的組ordertype，並得到一個上下文菜單，表示Add PO Number，它們可以再加入一個PO數量和該組頭他們獲得了上下文菜單說Add Billing Id。用戶還可以添加一個賬單ID而不需要添加一個賬號，這很重要，因爲這是我的數據變得不可靠的地方。比方說電網的樣子：

OrderGroupType: Direct 
    PONumber: 12345 
     BillingId: abc 

OrderGroupType: Direct 
    BillingId: abc 

我似乎無法弄清楚如何獲取與當前組這樣做，我從網格中的所有數據的數據行，然後通過它可以搜索和只返回等於我的組名行，然後我把這些信息納入一個數據屬性，我拉出的信息在上下文菜單：

groupText: ['Group Type: <b>{0} - {1} Item(s)</b>', 
      'PO Number: <b>{0} - {1} Item(s)</b>', 
      'Bill To: <b>{0} - {1} Item(s)</b>' 
     ], 
formatDisplayField: [ 
    function (ordgrpTypVal) { 
     //all rowData 
     var allRowData = $(this).jqGrid("getGridParam", "data"); 
     //this row data 
     var rowData = $.grep(allRowData, function (v) { 
      return v.OrderGroupType == grpTypVal; 
     }); 
     var elementId = "groupType_" + grpTypVal.replace(/\s+/g, '') + "_" + i++; 
     var newElement = '<span id="' + elementId + '" data-rowdata=\'' + JSON.stringify(rowData).replace(/'/g, "\\'") +'\' class="groupTypeMenu" style="cursor: pointer; color: blue;">' + grpTypVal + '</span>'; 
     return newElement; 
    } 
] 

我去的地方錯的是我，然後在這兩個函數formatDisplayField財產，我也設置鏈接/按鈕到兒童組：

formatDisplayField: [ 
    function (grpTypVal) { 
     //all rowData 
     var allRowData = $(this).jqGrid("getGridParam", "data"); 
     //this row data 
     var rowData = $.grep(allRowData, function (v) { 
      return v.OrderGroupType == grpTypVal; 
     }); 
     var elementId = "groupType_" + grpTypVal.replace(/\s+/g, '') + "_" + i++; 
     var newElement = '<span id="' + elementId + '" data-rowdata=\'' + JSON.stringify(rowData).replace(/'/g, "\\'") +'\' class="groupTypeMenu" style="cursor: pointer; color: blue;">' + grpTypVal + '</span>'; 
     return newElement; 
    }, 
    function (poVal) { 
     if (poVal !== null) { 
      //all rowData 
      var allRowData = $(this).jqGrid("getGridParam", "data"); 
      //this row data 
      var rowData = $.grep(allRowData, function (v) { 
       return v.PoNumber == poVal; 
      }); 
      var elementId = "PoNum_" + poVal.replace(/\s+/g, '') + "_" + i++; 
      var newElement = '<span id="' + elementId + '" data-rowdata=\'' + JSON.stringify(rowData).replace(/'/g, "\\'") + '\' class="poMenu" style="cursor: pointer; color: blue;">' + poVal + '</span>'; 
      return newElement; 
     } 
     else 
      return null; 
    }, 
    function (billToVal, val, props, index, obj) { 
     if (billToVal !== null) { 
      //all rowData 
      var allRowData = $(this).jqGrid("getGridParam", "data"); 
      //this row data 
      var rowData = $.grep(allRowData, function (v) { 
       return v.BillToId == billToVal; 
      }); 
      var elementId = "BillTo_" + billToVal.replace(/\s+/g, '') + "_" + i++; 
      var newElement = '<span id="' + elementId + '" data-rowdata=\'' + JSON.stringify(rowData).replace(/'/g, "\\'") + '\' class="billToMenu" style="cursor: pointer; color: blue;">' + billToVal + '</span>'; 
      return newElement; 
     } 
     else 
      return null; 
    } 
] 

這打破了，當我有了與同一結算ID父訂單數量計費ID。如果我有兩個在兩個不同順序組中完全相同的po數字，它也可能會崩潰。

所以我的問題是我怎樣才能更可靠地獲得有關組的數據？我更喜歡我只得到與特定組有關的rowData。我可以看到這種事情發生，如果我能得到更多的數據，也許是這樣的：

formatDisplayField: [ 
    function (billToVal, val, props, index, obj) { 
     if (billToVal !== null) { 
      //all rowData 
      var allRowData = $(this).jqGrid("getGridParam", "data"); 
      //this row data 
      var rowData = $.grep(allRowData, function (v) { 
       return v.BillToId == billToVal **&& v.PoNumber == obj.PoNumber && v.OrderGroupType == obj.OrderGroupType;** 
      }); 
      var elementId = "BillTo_" + billToVal.replace(/\s+/g, '') + "_" + i++; 
      var newElement = '<span id="' + elementId + '" data-rowdata=\'' + JSON.stringify(rowData).replace(/'/g, "\\'") + '\' class="billToMenu" style="cursor: pointer; color: blue;">' + billToVal + '</span>'; 
      return newElement; 
     } 
     else 
      return null; 
    } 
] 

下小提琴說明我的問題;看看它的工作單擊手冊，並選擇編輯，你會看到但是，它詳細介紹手冊橙色行，如果你對1點擊DSPO下，點擊編輯，你會看到它的顏色都具有的1計費ID的行而不僅僅是您選擇的行組......要編輯的行應爲橙色。 JSFIDDLE

任何幫助將是驚人的，我已經嘗試了很多不同的事情，數據是不可靠的。謝謝！

Answer 1

在我看來，你的代碼太複雜了，因爲它可能是。第一個非常重要的問題：您的輸入數據不包含具有唯一值的id屬性。例如，您只能使用JSON.stringify(rowData)而不是逗號分隔的列表rowid，這是因爲您的輸入數據沒有id值。例如，如果RecurringOrderLineTemplateId列的值是唯一的，那麼您可以在該列中添加key: true，並且jqGrid將使用該值作爲rowid。如果組合鍵（RecurringOrderHeaderTemplateId,RecurringOrderLineTemplateId）是唯一的，則可以使用值item.RecurringOrderHeaderTemplateId + "_" + item.RecurringOrderLineTemplateId填充id屬性。您將能夠通過使用rowid.split("_")從rowid獲取值RecurringOrderHeaderTemplateId和RecurringOrderLineTemplateId。設置好rowid並不能解決你的主要問題，但它會在以後節省你的時間。

在現有代碼的主要問題似乎是我的$.grep整個數據formatDisplayField回調內部使用。從性能角度和通用設計來看，這似乎是錯誤的。網格的數據已經被分組，但是您可以在每個formatDisplayField調用中重試相同的內容。我不喜歡它。

我不確定我是否完全理解您嘗試實施的內容。在我看來，您在列標題的<span>元素上設置了data-rowdata，只能在上下文菜單的click處理程序後面使用$link.data('rowdata')。您可以添加

var $tr = $(e.target).closest("tr.jqgroup"), 
    jqgrouplevel = parseInt($($tr).data("jqgrouplevel"), 10); 

內build回調contextMenu的，並且只使用

edit: { 
    ... 
    callback: function() { 
    for ($tr = $tr.next(); $tr.length; $tr = $tr.next()) { 
     if ($tr.hasClass("jqgroup") && parseInt($tr.data("jqgrouplevel"), 10) <= jqgrouplevel) { 
      break; // stop enumeration 
     } else if ($tr.hasClass("jqgrow")) { 
      $tr.addClass("markedForModification"); // mark the row 
     } 
    } 
    //EditBillToHeader(rowData) 
    } 

修改後的演示https://jsfiddle.net/dv4v8mmz/3/使用與「.billToMenu」一些額外的alerts和」 .poMenu上面的代碼「（只需複製代碼）。你可以看到這種方法有效。