Grid Add/Editポップアップフォームにカスタムテンプレートを使用しています。剣道UIグリッド - カスタム追加/編集ポップアップフォームテンプレートを使用しているときに、同じカスタム検証ルールが複数のフィールドで機能しない
ここは私のDEMOです。私のポップアップ形式で
、私は2つの郵便番号フィールドはpostcode1
とpostcode2
を命名したとの両方がカスタム検証ルールpostalCode
を使用して検証する必要があります。
は、今の問題は、私は両方のフィールドに同じカスタム検証ルール
postalCode
を適用した場合、その後の検証は、入力フィールドpostcode2
と入力フィールド作業postcode1
停止の検証のために働く、です。私はpostalCode
からpostalCode2
にカスタム検証ルールの名前を変更した場合
ただし、入力フィールドpostcode2
ため、検証は両方のフィールドのために働いて開始します。
これから私は、複数のフィールドで同じカスタム検証ルールを使用すると問題が発生することを知りました。
誰もが複数のフィールドに適用できるカスタム検証ルールを作成する方法を知っています。
ご協力いただければ幸いです!ありがとう。
HTML::
<div id="grid"></div>
<script type="text/html" id="popup_editor_template">
<div>
<h4>In Post Code fields, enter value length less than or greater than 4 to see custom validation error message for postcode</h4>
Address 1 : <input type="text" name="address1" required/> <br/>
Post code 1 : <input type="number" name="postcode1" required data-postalCode-msg="Postal Code must be four digits"
/> <br/><br/>
Address 2 : <input type="text" name="address2" required/> </br>
Post code 2 : <input type="number" name="postcode2" required
data-postalCode-msg="Postal Code must be four digits"
/> <br/>
</div>
</script>
JS:
以下が私のjsのコードフィドルデモです
function validatePostalCode(input)
{
//if (input.is("[data-customPostalCode]") && input.val())
if (input.val())
{
console.log("in validatePostalCode: ", input.attr('name'), input.val(), input.val().length);
//if (input.val().length != 4)
if(input.val().length != 4 || (/\D/.test(input.val())))
return false;
}
return true;
}
$("#grid").kendoGrid({
dataSource: {
type: "odata",
transport: {
read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
},
pageSize: 10,
serverPaging: true,
schema: {
model: {
fields: {
postcode1: {
type: "number",
defaultValue: null,
validation: {
postalCode: function (input) {
console.log('in heree');
if (input.is("[name=postcode1]"))
{
return validatePostalCode(input);
}
return true;
}
}
},
postcode2: {
type: "number",
defaultValue: null,
validation: {
//when changing rule name from "postalCode" to "postalCode2", the validation starts working on both fields
postalCode: function (input) {
console.log('in heree toooo');
if (input.is("[name=postcode2]"))
{
return validatePostalCode(input);
}
return true;
}
}
}
}
}
},
},
height: 800,
pageable: true,
columns: [
"OrderID",
"Freight",
"ShipName",
"ShipCity"
],
toolbar: [
{ name: "create" },
],
editable : {
mode: 'popup',
template: kendo.template($('#popup_editor_template').html())
},
save: function(e) {
alert('Now save');
e.preventDefault();
}
});