- - - - - - - - - - - - - - ผู้ให้การสนับสนุน- - - - - - - - - - - - - -

บทที่ 4 การใช้ Code Wizard กับ DropDownList

ขั้นตอนในการสร้าง

• ทำการเปิดไฟล์ myFirstDataPage.phpx จากบทที่ผ่านมา
• ลบ TextBox1 ออกไป จากหน้า Design
• ลบ Button1 ออกไป จากหน้า Design
• ทำการลากวาง DropDownList จากแท็บ Web Controls ของหน้าต่าง Toolbox

• คลิกเลือก DropDownList1 แล้วกำหนด Property ของ AutoPostBack เป็น True
• คลิกเลือก ที่ Code View (มุมมองโค้ด)
• ทำการลบ Sub Button1_Click ทิ้งทั้งหมด
• ลาก-วาง SELECT Data Method จากแท็บ Code Wizards ของหน้าต่าง Toolbox มาวางบน Code View

• จะปรากฏหน้าต่าง ให้เลือกฐานข้อมูล, ทำการเลือก (local).MatrixOrers จากในลิสต์
• คลิกปุ่ม Next
• ที่หน้าต่าง Construct a SELECT Query ในตำแหน่ง Tables: ให้เลือก Orders
• ในตำแหน่ง Columns: ให้เลือก OrderID

• คลิกปุ่ม Next

• ที่หน้าต่าง Query Preview ทำการคลิก Test Query จะมีการแสดงข้อมูลที่ได้จากคำสั่ง ที่เราได้สร้าง (ในที่นี้ ได้ทำการเพิ่ม ข้อมูลเข้าไปใน ตาราง Orders 2 เรคคอร์ด ด้วยกัน)

• คลิกปุ่ม Next
• ที่หน้าต่าง Name Method ทำการป้อนชื่อ Function ที่ได้สร้าง ในช่องกรอกข้อความ เป็น GetOrders

• คลิกปุ่ม Finish
• Code Wizard จะทำการสร้าง Function ที่ชื่อ GetOrders ให้โดยอัตโนมัติ ซึ่ง Function นี้จะมีการคืนค่าออกมาเป็น DataSet ซึ่งเราจะได้นำมาใช้ร่วม ด้วยวิธีการเขียนโค้ดต่อไป
• ทำการเพิ่ม Sub Page_Load โดยการคัดลอกไปวาง

Sub Page_Load(sender As Object, e As EventArgs)
    If Not Page.IsPostBack Then
        DropDownList1.DataTextField = "OrderID"
        DropDownList1.Datasource = GetOrders()
        DropDownList1.DataBind()
    End If
End Sub

• คลิกที่ Design เพื่อกลับไปยังหน้า Design View
• ทำการดับเบิ้ลคลิก DropDownList1
• ป้อนโค้ดต่อไปนี้ลงไปใน Sub DropDownList1_SelectedIndexChanged

Sub DropDownList1_SelectedIndexChanged(sender As Object, e As EventArgs)
    DataList1.DataSource = GetOrderDetails(DropDownList1.Items(DropDownList1.SelectedIndex).Text)
    DataList1.DataBind()
End Sub

• ทำการ Save ไฟล์
• ทดสอบ โปรแกรมโดยกดปุ่ม F5