ขั้นตอนการทำ Validate Custom Rules For Kendo MVVM
โจทย์ของวันนี้คือ การทำ Custom Rules ของ Kendo MVVM โดยที่จะมีวิธีการ Validate อยู่ 2 แบบที่เป็นโจทย์ของผม คือ
- จังหวะตอน lost focus ของ textbox
- จังหวะตอนกดปุ่ม +/-
จะเห็นได้ว่า ภายใน Rules นั้นมีการใส่วิธีการ Validate อยู่ ซึ่งจะเช็คจาก “viewModel.numberDisplay < 0 ” ถ้าน้อยกว่า Validate จะทำการโชว์ messages ตามที่เราตั้งค่าไว้ ถ้าเกิดไม่มีการกรอก จะทำการโชว์ messages default ที่เราตั้งค่าไว้ใน Rules เช่นกัน
เอ๋ะ ๆ ก่อนจะจบบทความนี้ ถ้าสังเกตดูดี ๆ ในส่วนของ function onChangeNumber จะเห็นว่ามี การเรียก .focus()/.blur() ทำไมกัน
จากโจทย์ข้างต้นด้านบน ทำให้ผมเจอปัญหาที่ว่า หลังจากกด ปุ่ม +/- แล้ว validate rules นั้นจะไม่ทำงาน เพราะ validate rules จะทำงานก็ต่อเมื่อ มันถูก focus เท่านั้น ทีนี้การกดปุ่ม +/- จะไม่เข้าเงื่อนไข
จึงเป็นที่มาของ .focus()/.blur() ซึ่งจะเป็นการสั่งการ ให้เจ้า input textbox นั้นถูก focus และ lost focus เลยจะเข้า function validate rules ของ kendo นั้นเองครับ
เหมือนเช่นเคยครับ เราจะไม่โชว์แค่ code เท่านั้น เรามี Editor มาฝาก Code ด้านบน ลองเข้าไปเล่นกันดูได้นะครับ
ขอบคุณครับ
