ExtJS 4.2.1 - 表單自定義字段驗證

我正在使用複選框選擇模型來選擇用戶，其中包含一個網格面板。提交後，用戶標識（以及其他表單字段值）被髮布到服務器。這工作完美。ExtJS 4.2.1 - 表單自定義字段驗證

但我需要爲該特殊（自定義）字段添加一個自定義驗證 - 如果沒有用戶被選中，顯示錯誤圖標並顯示錯誤工具提示文本。這是自定義字段組件截圖：

custom form field - users grid with checkbox selection model

，你可以在圖像中看到，有一個標題（xtype: label完成），然後一個空的空間，當前充滿標籤，無文本（由紅色矩形標記的區域）和網格本身。如果我選擇一個用戶（或更多），他們的名稱（空白數據）將顯示在該空白標籤中。

但是在驗證過程中，如果沒有用戶被選中，我需要在這裏的某處顯示帶有工具提示的錯誤圖標。

我可以使用，因此

grid.getSelectionModel().getSelection().length > 0 ? true : false

我明智的選擇是有效還是無效檢查所選的數據，但我不知道如何顯示錯誤圖標，也不是我應該在哪裏最好顯示它。我認爲該圖標的最佳位置應在標題標籤標籤內（左側或右側，這並不重要）。

任何有關如何顯示該圖標的幫助，都非常感謝！

來源

2013-08-26 shadyyx

是關於圖標和消息的**繪圖**（即HTML標記，CSS，如何使用Ext生成的）或關於驗證邏輯（組件，聽衆，最佳實踐等）？或兩者？ – rixo

@rixo主要通過消息提示來顯示該圖標。我最終實現了它，但也許你可以提供一個我會接受的更好的解決方案。驗證的邏輯已經完成並且正在工作。 – shadyyx

由於沒有人回答，我自己找到了一個解決方案，我想把它放在這裏，這樣也許有人可以告訴我更好的方法。

所以驗證後

if(grid.getSelectionModel().getSelection().length > 0) { 
    // valid, let's submit the form... 
} else { 
    // invalid, let's show the error hint 
}

我只需要解決具體的標籤，併爲它的文本 - 同時加入了具體的HTML標記是一樣的時顯示錯誤圖標的調用form.isValid() ：

label.setText(myPreviousText 
    + '<span role="presentation" class="x-form-error-msg x-form-invalid-icon" data-errorqtip="&lt;ul class=&quot;x-list-plain&quot;&gt;&lt;li role=&quot;alert&quot;&gt;' 
    + 'MY ERROR MESSAGE' 
    + '&lt;/li&gt;&lt;/ul&gt;" style="display: inline-block;"></span>', false);

現在我有帶風格提示的錯誤圖標。我在grid.select事件中將標籤文本設置回（設置回有效），並在grid.deselect事件中再次檢查有效性。

來源

2013-08-27 08:14:52 shadyyx

ExtJS 4.2.1 - 表單自定義字段驗證

回答

相關問題