[ASP.NET Core MVC Workshop#04] การ Delete ข้อมูลใน Database
ต่อไปเราจะทำการ Delete ข้อมูล โดยทำการด้วยปุ่ม Delete แน่นอนว่าจะใช้ Source code จากบทความก่อนหน้า [ASP.NET Core MVC Workshop#03] การทำ Form พร้อม Validate และการ Insert ข้อมูลลง Database หรือจะ Download ได้ที่ Github เช่นเคยครับ
ทำความเข้าใจ Flow การ Delete ของบทความนี้
การรับส่งข้อมูลจะเป็นคร่าว ๆ ดังนี้
ก็คือ เมื่อคลิกที่ปุ่ม Delete จะทำการ Set ค่า Id ด้วย JavaScript ให้กับ Input ตัวหนึ่งที่จะสร้างไว้ จากนั้นก็สั่งให้ Form ทำการ Submit
สร้าง Method สำหรับการ Delete ข้อมูล
ให้เปิดไฟล์ TrainingDotNetCoreMVC/Controllers/MovieController.cs ขึ้นมา และเพิ่ม Method ที่ชื่อว่า Delete ดังภาพ
จะได้ Code ทั้งหมดในไฟล์ดังกล่าวเป็นดังนี้
Method นี้จะรับค่า id ที่จะส่งมาจากหน้า View จากนั้นก็ Find หา Movie ที่มี id ดังกล่าว และสั่งให้มันลบ Movie นั้นซะ
แก้ไขหน้า View และเพิ่มปุ่ม Delete เรียกใช้ JavaScript event
ต่อไปให้ท่านผู้อ่านแก้ไข Code ในไฟล์ TrainingDotNetCoreMVC/Views/Movie/Index.cshtml ให้เป็นตามนี้
โดยสิ่งที่เพิ่มเข้ามาคือ
- Form: เพิ่ม Form Method Post เพื่อสำหรับส่งค่าไปที่ Controller
<td class="item-id">: เพิ่ม class ที่ชื่อว่าitem-id- ปุ่ม Delete: สำหรับการคลิกเพื่อ Set ค่าให้ Input type=Hidden โดย Set ผ่าน JavaScript event
- JavaScript event: ในที่นี้คือ การ Bind ให้ปุ่มที่มี
class = ".btn-danger"เมื่อคลิกแล้วจะทำ Function
ซึ่ง Function ที่ว่า ก็คือเช็ค Confirm ถ้าตอบ Yes ก็จะเก็บค่า id ใน Row ของ ปุ่ม Delete นั้น ๆ มา Set ให้ Input type = Hidden อีกที
และสุดท้ายสั่งให้ form ทำการ Submit - Input type=Hidden: เตรียม Input ที่เป็น Hidden สำหรับการรับค่า id ของ Row นั้น ๆ จากปุ่ม Delete
ทดสอบ
จากนั้นให้ลอง Run และทดสอบดู ก็จะได้ผลลัพธ์ว่าสามารถ Delete ข้อมูลได้
จบเรียบร้อยสำหรับการ Delete ก็ถือว่าไม่ค่อยเยอะ และไม่ค่อยปวดหัวเท่าไหร่ ขอบคุณท่านผู้อ่านที่อ่านจนจบ แล้วพบกันอีกครั้งใน #05 (Last) นะครับ
ส่วน Source code ของบทความนี้ สามารถ Download ได้ที่ลิงค์นี้ครับ
หากท่านผู้อ่านมีคำถามหรือข้อสงสัย หรือมีคำแนะนำ ติชม สามารถติดต่อผู้เขียนได้เลยครับ
