理解問題
嘗試將驗證類別應用於表中的動態文字方塊時會出現此問題。目標是在按一下「儲存」按鈕時對這些文字方塊執行驗證。
解決方案
要解決此問題,實施以下步驟至關重要:
-
包含Data-val 屬性: 將必要的data-val 屬性指派到文字框,以及用於驗證訊息的佔位符元素。這些屬性對於使用 jquery.validate.unobtrusive.js 進行用戶端驗證至關重要。
-
初始預設 ClsTargetInfo 物件: 首先將預設 ClsTargetInfo 物件新增至模型中的 TargetInfo 屬性,然後在檢視中產生其 HTML。
-
建立一個隱藏元素索引器: 在表格行中,包含索引器的隱藏輸入元素。這允許將非連續索引器發布並綁定到集合。
-
複製 HTML 範本: 檢查為表格行產生的 HTML。將其複製到表單標記外部的隱藏元素內,用虛擬字元 (#) 取代所有索引器。
-
複製並附加到表: 在 JavaScript 程式碼中,複製新行,更新索引器,並將其附加到表中。
-
重新解析驗證器: 新增行後,使用 $.validator.unobtrusive.parse(form) 重新解析驗證器。
附加說明
- Unobtrusive 驗證依賴解析 data-val 屬性在表單的初始呈現時。因此,新增動態內容時需要重新解析。
- 索引器的隱藏輸入允許刪除集合中的任何行。
- 考慮使用 CSS 而不是內聯樣式以獲得更好的可維護性和效能。
- 純粹在客戶端新增行時,利用部分視圖(BeginCollectionItem 幫助器)更容易維護側面。
以上是如何對錶中動態新增的文字方塊執行客戶端驗證?的詳細內容。更多資訊請關注PHP中文網其他相關文章!