通過請求負載將網格面板數據傳遞給REST控制器

我有一個在extjs框架中創建的用戶表單。用戶表單有很多用戶字段，這些字段是作爲請求負載的一部分傳遞給REST控制器的。我正在嘗試向用戶表單添加一個網格面板（最有可能以多行&列的表格格式）。但我不知道如何將網格面板數據作爲請求負載的一部分傳遞給REST控制器。如果需要更多的細節，我會發布更多的代碼。任何幫助，將不勝感激。謝謝。通過請求負載將網格面板數據傳遞給REST控制器

Ext.define('soylentgreen.view.admin.UserForm', { 
    extend : 'Ext.form.Panel', 
    alias : 'widget.userform', 
    bodyStyle : 'padding:5px 5px 0', 

// some userform elements like firstname,lastname, go here..... 

name : 'userTeamGrid', 
    xtype : 'gridpanel', 
id : 'userTeamGrid', 
itemId : 'userTeamGrid', 
multiSelect : true, 
selModel : Ext.create(
     'Ext.selection.CheckboxModel', 
     { 
      injectCheckbox : 'first', 
      mode : 'MULTI', 
      checkOnly : false 
     }), 
anchor : '100%', 
width : '700px', 
height : 250, 
flex : 1, 
store : 'userTeamStore', 

var user = form.getRecord(); 
form.updateRecord(user); 
user.save({ 
     callback : function(records, operation){ 
      //reset the (static) proxy extraParams object 
      user.getProxy().extraParams = { 
      requestType: 'standard' 
      } 
      if(!operation.wasSuccessful()){ 
      var error = operation.getError();

來源

2017-06-10 Poonkodi Sivapragasam

IMO，這是我們在ExtJS中遇到的最複雜但最常見的問題之一。必須經常解決，但大多數解決方案必須根據具體要求略有不同。

網格綁定到完整存儲，而不是單個記錄。因此，如果您想從記錄（例如作爲數組）獲取數據到網格中，反之亦然，則必須在商店的數據和記錄的單個字段中的值之間建立映射關係。例如，從商店獲得的所有數據，通用的解決方案是

store.getRange().map(function(record) { return record.getData(); });

如果您只需要電網選擇（也許你想使用checkboxselection模型或類似）和/或只將記錄某些字段，你必須將此代碼更改爲您的需求，例如

grid.getSelectionModel().getSelection().map(function(record) {return record.get('Id'); });

因此，您的記錄是綁定到窗體，並且窗體由字段組成。你如何讓網格數據被接受爲表單的一部分？

你有一個hiddenfield添加到您的表格，並根據您的要求，覆蓋一些的四大功能setValue，getValue，getModelData，getSubmitValue。通常，hiddenfield會嘗試將其值轉換爲字符串，但很明顯，您需要在其中允許數組;並且只要調用setValue就想要修改網格，或者每當調用一個getter時讀取網格中的值。這四個函數用於以下內容：

setValuesetValue應根據您在記錄中找到的值來修改網格。
getValue用於比較操作（檢查值是否已更改，這意味着窗體很髒並且必須提交等），如果您致電form.getValues。你應該根據其中的網格狀態返回一些值。
getModelData用於form.updateRecord的方法;它應該返回模型字段的convert方法可以使用的值。
getSubmitValue使用由form.submit方法，它應該返回，可以被安全地傳輸到服務器的值（必須是如果表單沒有sendAsJson:true集的字符串）

我不能給你這些實現的確切配方，因爲它們是特定於您的需求的。

來源

2017-06-10 13:00:06 Alexander

感謝您的詳細回覆。我試圖按照你解釋的方式進行編碼。我創建了一個xtype作爲隱藏字段，用於在用戶窗體中綁定數組，當我在隱藏域中調用setValue時，只要網格數據發生更改，它的數據保存爲[object，Object]而不是數組值。你能告訴我如何將這些數據作爲精確數組存儲在隱藏域中嗎？ –

@PoonkodiSivapragasam正如我所說的，你必須重寫setValue函數，以便它接受數組。 – Alexander

我試圖覆蓋後，我得到錯誤ext-all.js：15未捕獲TypeError：無法讀取在Object.override（ext-all.js：15）未定義的屬性'$ className'。你能告訴我我的代碼有什麼問題嗎？ Ext.override（'Ext.form.field.Hidden'，{ setValue：function（val）{ this.callParent（['In override']）; return this; } }）; –

通過請求負載將網格面板數據傳遞給REST控制器

回答

相關問題