บทความนี้สาธิตการพัฒนาระบบเว็บแอพพลิเคชั่น Contoso University ซึ่งผมได้ศึกษาจากเว็บไซท์ http://asp.net/
หากต้องการอ่านบทความต้นฉบับจะอยู่ที่
http://www.asp.net/entity-framework/tutorials/the-entity-framework-and-aspnet-–-getting-started-part-1
ผมได้ศึกษา และทดลองทำตามแล้วนำมาเล่าให้ท่านอ่านกันอีกครั้ง อรรถรสอาจมาก น้อยไปกราบขออภัยมา ณ โอกาสนี้ด้วยครับ
ในตอนที่ 2 เราจะสร้างเพจข้อมูลนักเรียน และจัดการข้อมูลนักเรียนก และเพจการแสดงรายวิชาของสาขาที่ระบุ
จุดประสงค์
สร้างเพจการจัดการข้อมูลนักเรียน และเพจการแสดงรายวิชา
ดำเนินการ
1.ให้เพิ่มเว็บฟอร์มใน Project ตั้งชื่อว่า Students.aspx และเลือกใช้ MasterPage แล้วคลิก Add
2. เลือก Master page แล้วคลิกปุ่ม OK
3. เมื่อเพจ Student.aspx ได้ถูก Load ขึ้นมาให้ เพิ่ม Code ลงไปในหน้า html code ในบรรทัดที่ 8 – 9
4. หลังจากที่เราได้สร้าง EDM เอาไว้ในตอนที่ 1 เราจำเป็นต้อง Build Project ก่อนใช้งาน
ด้วยการคลิกขวาที่ชื่อ Project ใน Solution Explorer แล้วเลือก Build
5. คลิกที่ EntityDatasource เพื่อกำหนดค่า ด้วยการเลือก Configure Data Source
5. ระบุ Named Connection ชื่อ SchoolEntities และ ContainerName ดังตัวอย่าง แล้วคลิก Next
6. ที่ช่อง EntitySetname เลือก People และเลือกใช้ทุกฟิลด์ และให้ EDS สามารถแก้ไข และสามารถลบข้อมูลได้ แล้วคลิก Finish
7. เราต้องกำหนดค่าให้ database สามารถลบข้อมูลได้ เนื่องจาก ตาราง Person มี คสพ กับตารางอื่นๆ หากไม่กำหนดค่านี้จะเกิด Error เมื่อสั่งลบข้อมูล (!!! หมายเหตุ ให้เราสร้าง Database Diagram ที่ฐานข้อมูล School )
ให้คลิกที่หน้าต่าง Database Explorer และคลิกสองครั้งที่ Diagram_0
8. VS 2010 จะเปิดหน้าต่างแสดง คสพ ของ Database ขึ้นมา ให้คลิกขวาที่เส้น คสพ ของ Person และ StudentGrade
9. ที่หน้าต่าง Properties ทางด้านขวา ให้คลิกกำหนดค่า Delete เป็น Cascade
เสร็จแล้วให้บันทึก
10. การเปลี่ยนแปลงข้อมูลที่ระดับ Database เราต้องปรับปรุงข้อมูลที่ EDM ด้วย
ด้วยการคลิกขวาที่ Entity Data Model แล้วเลือก Update Model from database
11.ที่หน้าการ refresh ให้คลิก Person แล้วคลิกปุ่ม Finish
12. เมื่อการปรับปรุง EDM เสร็จสิ้นแล้วให้สร้างเพจการแสดงรายชื่อผู้เรียน
ด้วยการลาก GridView วางในเพจ Students.aspx แล้วกำหนดค่าแหล่งข้อมูลให้เป็น EDS ที่ได้สร้างไว้ก่อนหน้า
ให้ Enable ตามตัวอย่างนี้
13.เลือก Field ที่ต้องการแสดงดังนี้
14.และเปลี่ยนทั้งสองฟิลด์ให้เป็น Template Field ด้วยการคลิกที่ Convert to template…. ทั้งสองฟิลด์
แล้วคลิกปุ่ม OK
15. ที่หน้าเพจ Source View ที่ Template FirstName ให้เปลี่ยน Code ดังนี้
อธิบาย ที่เทมเพลต Item ใช้เพื่อแสดงข้อมูล เราได้นำคอนโทรลลาเบลมาวางสองตัวและผูกกับข้อมูล LastName และ FirstName
ส่วนเทมเพลต Edititem ให้แสดงกล่องข้อความ FirstName , LastName เพื่อให้ป้อนข้อมูลใหม่ลงไป
16. การเพิ่มประสิทธิภาพของ EntityDatasource
ในเอกสารได้แนะนำให้เราลบ Attrubute Connection String และ DefaultContainerName แล้วเปลี่ยนไปใช้ ContextTypeName=”…” แทน มีข้อดีคือมีประสิทธิภาพสูงกว่าแบบเดิมเพราะเราชี้ไปยังแหล่งข้อมูลที่ต้องการทำงานด้วย โดยตรง
17. แล้วทดลองรันเพจนี้ด้วยการกด F5 จะได้ผลดังนี้
หากลองคลิกลิ้ง Edit จะแสดงหน้าการแก้ไขดังนี้
18.ต้องการเพิ่มคอลัมน์การแสดงรายวิชาที่ผู้เรียนได้เรียน ให้คลิกที่ EntityDatasource แล้วไปเพิ่ม Entity ชื่อ StudentGrade ลงไปที่คุณสมบัต Include
และแก้ไขที่ gridview ก่อนแล้วเพิ่ม Template Field ต่อท้ายลงไปดังนี้
แล้วทดลองรันเพจดูจะแสดงจำนวนรายวิชาออกมาดังนี้
19.จากนั้นเราจะมาสร้าง ฟอร์มกรอกข้อมูลนักเรียนกัน โดยการใช้ Detailview
ก่อนอื่นให้เพิ่ม WebForm เข้าไปใน Project ตั้งชื่อว่า StudentAdd.aspx แล้วลากคอนโทรล DetailView ไปวางในฟอร์ม และลาก Entity Data control เข้ามาด้วย
และกำหนดค่าดังนี้
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>Add New Students</h2>
<asp:EntityDataSource ID="StudentsEntityDataSource" runat="server"
ContextTypeName="ContosoUniversity.DAL.SchoolEntities" EnableFlattening="False"
EnableInsert="True" EntitySetName="People">
</asp:EntityDataSource>
<asp:DetailsView ID="StudentsDetailsView" runat="server"
DataSourceID="StudentsEntityDataSource" AutoGenerateRows="False"
DefaultMode="Insert">
<Fields>
<asp:BoundField DataField="FirstMidName" HeaderText="First Name"
SortExpression="FirstMidName" />
<asp:BoundField DataField="LastName" HeaderText="Last Name"
SortExpression="LastName" />
<asp:BoundField DataField="EnrollmentDate" HeaderText="Enrollment Date"
SortExpression="EnrollmentDate" />
<asp:CommandField ShowInsertButton="True" />
</Fields>
</asp:DetailsView>
</asp:Content>
จาก Tag ข้างต้น ที่ EDS เป็นการรุะบุแหล่งข้อมูลที่ใช้งาน นั้นคือ person และ tag Detailview ใช้เชื่อมต่อกับ EDS ที่ได้สร้างไว้แล้ว โดยระบุ attrib ว่าไม่ต้องสร้างแถวให้ เพราะเราจะสร้างเองในแท็ก Field ภายใน tag field จะประกอบไปด้วย 3 แถวคือชื่อ สกุล วันที่ลงเรียน และแถวสุดท้ายเป็นปุ่มแทรกข้อมูล
เมื่อโค้ดแล้วให้ลองรันเพจดู แล้วทดสอบโค้ดดูนะครับ
20. ต่อไปเราจะสร้างเพจการแสดงงรายวิชาจากสาขาวิชา
ให้เราสร้างเพจขึ้นใหม่ชื่อว่า Courses.aspx แล้วลากคอนโทรล EntityDatasouce และ Dropdownlist ลงไป และระบุโค้ดลงใน source view ดังนี้
จะเห็นว่าที่ EDS ระบุุให้เชื่อมต่อไปยัง Departments
และที่ Dropdownlist ให้เรียกใช้ EDS และเรียกฟิลด Name ออกไปแสดง และให้ Value เป็นค่า ID ของ Department ทดลองรันเพจนี้จะได้ดังนี้
สำหรับบทที่ 2 ตัดจบเพียงเท่านี้ก่อนนะครับ
Happy Coding