|
|
การเขียนโค้ดร่วมกับ Control
ตัวอย่างต่อไปนี้ จะเป็นการแสดงถึง การเขียนโค้ด เพื่อแสดงข้อความที่อยู่ใน Textbox เมื่อมีการคลิกปุ่ม โดยข้อความ จะไปแสดงที่ Label ที่เราได้สร้างขึ้น
ขั้นตอนการสร้าง
- เปิดโปรแกรม ASP.NET Web Matrix และทำการสร้างไฟล์ ASP.NET ตั้งชื่อว่า
Hello2.phpx บันทึกไฟล์ไว้ที่ Root Directory (ในตัวอย่างนี้คือ
Root Directory ของ IIS = C:\inetput\wwwroot\)
- ให้ทำการลาก-วาง (Drag and Drop) Control ที่ชื่อ TextBox, Button
และ Label จากแท็บ Web Control ที่อยู่ในหน้าต่าง
Toolbox ดังรูป
- จากขั้นตอนการออกแบบ หน้าตาของเว็บโดยการลากวาง Control ที่ต้องการ โปรแกรม
Web Matrix ก็จะทำการสร้างโค้ด การทำงานให้คุณโดยอัตโนมัติ โดยคุณสามารถดูได้จาก
แท็บ HTML ก็จะปรากฏ โค้ด ดังตาราง ด้านล่าง
<html>
<head>
</head>
<body>
<form runat="server">
<p>
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox>
<asp:Button id="Button1" runat="server" Text="Button"></asp:Button>
</p>
<p>
<asp:Label id="Label1" runat="server">Label</asp:Label>
</p>
<!-- Insert content here -->
</form>
</body>
</html>
- ให้กลับมาที่ แท็บ Design แล้วทำการ Double Click ที่ปุ่ม
Button, โปรแกรม Web Matrix จะทำการสร้าง เมทธอด(server-side event
handler method) ที่ชื่อว่า Button1_Click ขึ้นมา ในแท็บ Code ซึ่ง
เมทธอดนี้ จะทำงานก็ต่อเมื่อ ผู้ใช้ทำการคลิกปุ่ม ดังกล่าว
- ทำการป้อนโค้ดด้านล่าง ต่อไปนี้ ลงใน Method Button1_Click
Sub Button1_Click(sender As Object, e As EventArgs)
Label1.Text = "Hello..."& TextBox1.Text
End Sub
- หากคุณต้องการ ดูโค้ดทั้งหมดที่เราได้สร้างขึ้น สามารถดูได้จาก แท็บ
ALL
- ทำการบันทึกไฟล์ แล้วทดลอง Run โปรแกรม โดยกดปุ่ม F5 หรือคลิกที่ปุ่ม
Start บน Toolbar
- ให้ทำการป้อนข้อความลงใน TextBox แล้วคลิกปุ่ม Button
ก็จะเห็นการทำงาน ของโปรแกรม ที่เราได้เขียนขึ้นมา จากขั้นตอนต่างๆ ข้างต้น
|
by 9'M (23 Aug 2003)
