การสร้าง Web Application โดยใช้ ASP.NET MVC: ตอนที่ 2

สร้างคอนโทรลเลอร์ใหม่ขึ้นมารองรับรีวิวคอร์สอบรม โดยไปที่ Solution Explorer คลิกขวาที่โฟลเดอร์ Controllers > Add > Controller และตั้งชื่อคอนโทรลเลอร์นี้ว่า ReviewsController พร้อมกับเลือกใช้ Template “MVC controller with empty read/write actions” และคลิก Add

จากนั้น โปรแกรม Visual Studio จะสร้างคอนโทรลเลอร์ ReviewsController ขึ้นจากเทมเพลตดังรูปข้างล่าง ซึ่งประกอบด้วยเมธอด Index เป็นดีฟอลต์แอ็กชั่น ตลอดจนเมธอด Details, Create, Edit และ Delete ที่ท่านสามารถเพิ่มเนื้อหาโค้ดได้ตามใจชอบ

ปกติแล้วเราจะใช้แอ็กชั่น Index ในการสั่งแสดงรายการรีวิวทุกอย่างๆ ออกมา แต่ตอนนี้ เรายังขาดโมเดลที่เอาไว้ represent ชุดรายการรีวิว จึงต้องสร้างคลาสของโมเดลใหม่ โดยไปที่ Solution Explorer คลิกขวาที่โฟลเดอร์ Models > Add > Class ตั้งชื่อคลาสว่า CourseReview และคลิก Add

โปรแกรม Visual Studio ก็จะสร้างไฟล์ CourseReview.cs ขึ้นมา

เนื่องจากต่อไป เว็บแอพพลิเคชันนี้จะต้องเชื่อมต่อกับดาต้าเบส เราจึงต้องกำหนดพร็อพเพอร์ตี้ ID เพื่อเป็น primary key, Course สำหรับเก็บชื่อคอร์ส, Teacher สำหรับเก็บชื่ออาจารย์, Comment สำหรับเก็บข้อคิดเห็น และ Rating สำหรับเก็บระดับความพึงพอใจ (Tip: พิมพ์คำว่า prop แล้วกดแป้น Tab ติดกันสองที ดูผลครับว่าเกิดอะไรขึ้น)

สลับมาที่ ReviewsController เลื่อนลงข้างล่างสุด แล้วเพิ่มข้อมูล In-Memory ในรูปแบบ static private List ของคลาสโมเดล CourseReview เข้าไป เพื่อใช้งานทดแทนการเข้าถึงดาต้าเบสของจริงพลางๆ ก่อน (ผมจะสอนวิธีใช้ LINQ + Entity Framework อย่างละเอียดภายหลัง) ดังรูป:

จากนั้นไปที่แอ็กชั่น Index ของ ReviewsController.cs แล้วแก้โค้ดตามรูปข้างล่าง เพื่อบอกว่าโมเดลที่ผูกกับแอ็กชั่นนี้ให้เอาจาก LINQ query ที่มีการ select ทุกรีวิว แสดงผลเรียงตามลำดับชื่อ Teacher

เราก็จะได้โมเดลสำหรับวิวที่ยังไม่ได้ถูกสร้างขึ้น ให้ท่านทดลองรันโปรเจ็กต์ตอนนี้ ป้อน URL http://localhost:{เลขพอร์ต}/reviews จะได้ผลดังรูป:

เหตุที่ฟ้อง error เนื่องจากเราบอก MVC runtime ว่าต้องการเร็นเดอร์วิวจากแอ็กชั่น Index ของReviewsController รันไทม์ก็จะค้นหาวิวสำหรับใช้เป็นเท็มเพลตโดยใช้วิธี “ตามธรรมเนียม” กล่าวคือ พยายามหาไฟล์วิวชื่อ Index (ชื่อตรงกับแอ็กชั่น) จากโฟลเดอร์ Views\Reviews (ชื่อสอดคล้องกับคอนโทรลเลอร์) ซึ่งไฟล์ Index นี้มีได้หลายนามสกุล เพราะ MVC engine มีวิวเอ็นจินให้เลือกใช้สองตัวโดยดีฟอลต์ ได้แก่:

WebForm view engine : ไฟล์วิวใช้นามสกุล .aspx หรือ .ascx (เก่าแล้ว ไม่นิยมใช้)
Razor view engine : ไฟล์วิวใช้นามสกุล .cshtml (กรณี C#) หรือ vbhtml (กรณี Visual Basic)

นอกจากนี้ รันไทม์ยังพยายามค้นหาวิวจากโฟลเดอร์ Views\Shared เนื่องจากเป็นโฟลเดอร์สำหรับเก็บวิวที่เอาไว้ให้คอนโทรลเลอร์ทุกตัวแบ่งกันใช้ แต่ก็หาไม่เจอ

เพราะฉะนั้น ท่านต้องสร้างวิวขึ้นมาโดยคลิกขวาที่แอ็กชั่น Index > Add View และระบุพารามิเตอร์ต่างๆ ตามรูปข้างล่าง สังเกตว่าเลือก Create a strongly-typed view เพราะเรารู้จักชนิดของออปเจ็กต์โมเดลที่จะป้อนให้วิวดีอยู่แล้ว, เลือก Scaffold template เป็น List เพราะต้องการให้วิวแสดงข้อมูลรีวิวเป็นลิสต์ เสร็จแล้วคลิก Add