ตอนจบ การสร้าง JavaScript ให้รองรับ MVVM ของ Kendo UI (Telerik)
ถ้าใครได้อ่านบทความนี้ แล้วมาอ่านต่อที่บทความนี้จะได้ทำความเข้าใจในส่วนของ JavaScript ที่ใช้กับ MVVM เรามาเริ่มกันเลย ก่อนอื่นให้เราประกาศเรียกใช้ JavaScript ตามภาพนี้เลย
จากนั้นเราจะกำหนด DataSource เพื่อให้ Grid สามารถใช้งานได้ก็จะกำหนดตามนี้ ถ้าอยากศึกษา DataSource เพิ่มเติมอ่านได้ที่ Doc ของ Telerik
กำหนด data-bind ให้กับ html เพื่อให้ html นั้นดึง Datasource ที่เราสร้างไว้ไปใช้งาน
data-bind=”source: products”
หลังจากกำหนด DataSource เสร็จแล้ว สิ่งที่อย่าลืมคือ Data ที่ได้รับจาก API นั้นมี ข้อมูลอะไรบ้างที่เราต้องการโชว์ข้อมูล
เมื่อเราเลือกได้แล้ว จะต้องนำชื่อของ Data ที่ใช้ไป bind ให้กับ html ของเรา เช่น เราต้องการโชว์ข้อมูลของ ID,Name,Price เป็นต้น เราจะต้องไปกำหนดค่าที่ html
data-columns=”[{ ‘field’: ‘ProductName’, ‘width’: 270 }, { ‘field’: ‘UnitPrice’ }, { ‘field’: ‘UnitsInStock’ } ]”
สุดท้ายนี้หวังว่า บทความนี้จะเป็นประโยชน์ไม่มากก็น้อย ถ้าผิดพลาดประการใดก็ขออภัยไว้ ณ ที่นี้ด้วยครับ ให้กำลังใจผมได้โดยกดตบมือนะครับ ไว้มีเนื้อหาใหม่ ๆ ผมจะมาอัพเดทอีกครั้งครับ
ตอนที่ 1 ความแตกต่างระหว่าง MVVM และ jQuery ในการเรียกใช้ Kendo UI (Telerik)
