我正在使用kendo網格自定義模板彈出添加/編輯窗體。這是我的工作DEMO使用Kendo網格自定義彈出窗口編輯器模板時添加/編輯表單字段的條件和自定義驗證
我想要實現的表單字段,例如條件驗證如果輸入的地址(不空),那麼任何值的字段城市和郵遞區號應該成爲需要,否則他們可以爲空。此外,我想ISE一個自定義的驗證規則郵編使得其長度應始終等於4否則它應該顯示自定義錯誤消息「郵編必須是四位」
我剛纔提到這些鏈接:
Validation rules in datasource.model
Custom validation rules and error messages
,但我想不通我怎麼能實現我的數據源模型驗證?
這裏是我的代碼:
HTML:
<h3>I want to implement conditional validation on Add/Edit form such as if any value is entered for Address then the fields City and Postal Code should become required</h3>
<div id="grid"></div>
<script id="popup-editor" type="text/x-kendo-template">
<p>
<label>Name:<input name="name" required /></label>
</p>
<p>
<label>Age: <input data-role="numerictextbox" name="age" required /></label>
</p>
<p>
<label>Address: <input name="address"/></label>
</p>
<p>
<label>City: <input name="city"/></label>
</p>
<p>
<label>Post Code: <input name="postcode"/></label>
</p>
</script>
JS:
$("#grid").kendoGrid({
columns: [
{ field: "name" },
{ field: "age" },
{ command: "edit" }
],
dataSource: {
data: [
{ id: 1, name: "Jane Doe", age: 30 },
{ id: 2, name: "John Doe", age: 33 }
],
schema: {
model: { id: "id" },
fields: {
name:{},
age:{},
address:{},
city:{},
postcode:{},
},
}
},
editable: {
mode: "popup",
template: kendo.template($("#popup-editor").html())
},
toolbar: [{ name: 'create', text: 'Add' }]
});
謝謝您的回答伴侶這是很大的幫助,所以在UP爲你。但是我沒有接受它作爲答案,因爲它仍然錯過了郵編長度的自定義驗證。無論如何,有了你的提示,我找到了我的解決方案。再次感謝 :) –