บทที่ 2 asp.net

67
บบบบบ บบบบบ 2 2 ASP.NET ASP.NET 1 บบบบบบบ บบบบบบบ บบบบบบบบบบบบบบบ บบบบบบบบบบบบบบบ บบ บบ WWW WWW

Upload: xaviera-mcguire

Post on 03-Jan-2016

87 views

Category:

Documents


0 download

DESCRIPTION

บทที่ 2 ASP.NET. รายวิชา การเขียนโปรแกรมบน WWW. เทคโนโลยี ASP.NET. - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: บทที่  2 ASP.NET

บทท��บทท�� 22ASP.NETASP.NET

1

รายวิชารายวิชา

การเขี�ยนโปรแกรมบน การเขี�ยนโปรแกรมบน WWWWWW

Page 2: บทที่  2 ASP.NET

เทคโนโลย� เทคโนโลย� ASP.NETASP.NET

ASP.NET (Active Server Pages.NET) ได้�รั�บการัพั�ฒนามาจาก ASP เวอรั�ชั่� �น 3.0เพั��อให้�สามารัถรัองรั�บแนวคิ�ด้ของ .NET ได้� โด้ยเรัาสามารัถพั�ฒนา ASP.NET ได้�จากทุ"กภาษาทุ%�สน�บสน"นแนวคิ�ด้ของ . NET โด้ยทุ%�น�ยมใชั่�ก&คิ�อ VB.NET, C# ,JScript.NET ซึ่(�งเป็*นรั+ป็แบบแอพัพัลิ�เคิชั่�นทุ%�สรั�างเพั��อทุ-างานบนเว&บเซึ่�รั�ฟเวอรั� โด้ยจะโต้�ต้อบก�บผู้+�ใชั่�งานเห้ม�อนเว&บเพัจทุ��วไป็ การัทุ-างานของ ASP.NET จะเป็*นแบบ Server-Side Script ซึ่(�งเป็*นการัทุ-างานทุ%�ฝั่3� งเซึ่�รั�ฟเวอรั�

Page 3: บทที่  2 ASP.NET

3

องค�ประกอบขีอง องค�ประกอบขีอง ASP.NET Web ASP.NET Web ApplicationApplication

Page 4: บทที่  2 ASP.NET

4

กระบวินการท�างานขีอง กระบวินการท�างานขีอง ASP.NETASP.NET

Page 5: บทที่  2 ASP.NET

5

ขี�อดี�ในการพั�ฒนาแอพัพัลเคช��นดี�วิย ขี�อดี�ในการพั�ฒนาแอพัพัลเคช��นดี�วิย ASP.NETASP.NET

• ใชั่�ภาษาได้�ห้ลิากห้ลิายในการัเข%ยนสคิรั�ป็ต้�•ม%คิวามย�ด้ห้ย"4นในการัเข%ยนโป็รัแกรัมแลิะการัแป็ลิภาษาโป็รัแกรัม

ทุ-างานได้�เรั&วข(5น•ม%การัรัวมก�นทุ-างานฝั่3� งไคิลิเอนต้�แลิะเซึ่�รั�ฟเวอรั�เข�าด้�วยก�น•ม%รั+ป็แบบแลิะการัใชั่�งานคิอมโพัเนนต้�ทุ%�ง4ายข(5น•ม%ไลิบรัารั%มาต้รัฐานให้�ใชั่�รั4วมก�บภาษาอ��น ๆ•การัเข%ยนโป็รัแกรัมแลิะการัออกแบบส4วนต้�ด้ต้4อผู้+�ใชั่�ด้�วยคิอนโทุรัลิ

ทุ-าได้�ง4ายข(5น•ไม4ข(5นก�บฮารั�ด้แวรั�•ง4ายต้4อการัห้าข�อผู้�ด้พัลิาด้ในเข%ยนโป็รัแกรัม•สามารัถเข%ยนโป็รัแกรัมก-าก�บเห้ต้"การัณ์�ต้4าง ๆ ในเว&บเพัจได้�•แยกส4วนทุ%�เป็*น HTML ก�บส4วนของสคิรั�ป็ต้�ออกจากก�นอย4างชั่�ด้เจน

Page 6: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

การัทุ%�จะใชั่�งาน ASP.NET ได้�น� 5นต้�องใชั่�โป็รัแกรัมห้ลิ�กๆ ด้�งน%5 IIS (Internet Information Services) คิ�อ

โป็รัแกรัมทุ%�ทุ-าห้น�าทุ%�จ-าลิองเคิรั��องของเรัาให้�เป็*น Server จ(งทุ-าให้�สามารัถ RUN คิ-าส��ง ASP.NET ได้� เพัรัาะ ASP.NET เป็*นลิ�กษณ์ะของ Server-Side Programming

Visual .NET Studio เป็*นเคิรั��องม�อทุ%�เห้มาะสมทุ%�ส"ด้ในการัพั�ฒนา ASP.NET ซึ่(�งอาจเลิ�อกใชั่� Notepad ห้รั�อ Dreamweaver ในการัพั�ฒนาก&ได้�เชั่4นก�น แต้4อาจไม4สน�บสน"น ASP.NET ทุ�5งห้มด้ได้�

WEB Browser สามารัถใชั่� IE (Internet Explorer) ห้รั�อเว&บบรัาวเซึ่อรั�อ��นๆ ทุ%�สน�บสน"นก&ได้�

Page 7: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

IIS Web Server เป็*นโป็รัแกรัมทุ%�ม%ต้�ด้มาก�บต้�วโป็รัแกรัม Windows XP เรัาสามารัถทุ-าการัต้�ด้ต้�5ง IIS เพั��มเต้�มได้�จากแผู้4น CD-ROM Install Windows (version ทุ%�เรัาใชั่�งาน  ) ซึ่(�งข�5นต้อนการัต้�ด้ต้�5งม%ด้�งน%5

1 .ให้�ใส4แผู้4นของโป็รัแกรัม Windows ไว�ในเคิรั��องอ4าน

2. ไป็ทุ%� Control Panel -> Add or Remove Programs จากน�5นให้�ทุ-าต้ามข�5นต้อนด้�งน%5

Page 8: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

3. เลิ�อกไป็ทุ%� Add/Remove Windows Components 

Page 9: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

4 .ต้�;กเคิรั��องห้มายถ+กทุ%�ห้น�าเมน+ Internet Information Services (IIS)  แลิ�วทุ-าการั Click ทุ%�ป็"<ม Next เพั��อเรั��มการัต้�ด้ต้�5ง 

Page 10: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

5 .กรัณ์%รัะบบถามห้าต้�วต้�ด้ต้�5ง Windows XP ให้�คิลิ�กป็"<ม OK แลิ�วทุ-าการั Browse ห้าแผู้4น CD ต้�ด้ต้�5ง Windows XP ห้�อง i386

Page 11: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

6. คิลิ�กป็"<ม Open, OK

Page 12: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

7. รัะบบบจะทุ-าการัต้�ด้ต้�5ง IIS ด้�งรั+ป็

Page 13: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

8. คิลิ�กป็"<ม Finish

Page 14: บทที่  2 ASP.NET

การติดีติ�"ง การติดีติ�"ง IISIIS

9. จากน�5นให้�เรัาทุ-าการัเป็=ด้ Web Browser ของเรัาข(5นมา ทุ%� Address Bar ให้�เรัาทุ-าการัพั�มพั�http://localhost/ เพั��อทุ-าการัทุด้สอบการัใชั่�งาน IIS ห้ากป็รัากฏม%ห้น�าจอต้�อนรั�บ ด้�งรั+ป็ด้�านลิ4างน%5 แสด้งว4าเรัาสามารัถใชั่�งาน IIS Web Server ได้�แลิ�ว

Page 15: บทที่  2 ASP.NET

การปร�บแติ#ง การปร�บแติ#ง IIS IIS ก#อนการใช�งานก#อนการใช�งาน

คิลิ�กทุ%� Start > Control Panel > Administrative > Tools < Internet Information Service (IIS) Manager

Page 16: บทที่  2 ASP.NET

การปร�บแติ#ง การปร�บแติ#ง IIS IIS ก#อนการใช�งานก#อนการใช�งาน

คิลิ�กแต้กไฟลิ�ทุ%�ชั่��อ …(Computer name) > Web Sites > Default Web Site

คิลิ�กขวาทุ%� Default Web Site แลิ�วเลิ�อก Properties เพั��อทุ-าการัป็รั�บแต้4ง

Page 17: บทที่  2 ASP.NET

การปร�บแติ#ง การปร�บแติ#ง IIS IIS ก#อนการใช�งานก#อนการใช�งาน

คิลิ�กทุ%�แทุ&ป็ Home Directory ห้รั�อทุ%�เก&บข�อม+ลิเว&บไซึ่ต้� โด้ยป็กต้�ห้�องเก&บพั�5นฐานจะเป็*น c:\inetpub\wwwroot ด้�งรั+ป็

Page 18: บทที่  2 ASP.NET

การปร�บแติ#ง การปร�บแติ#ง IIS IIS ก#อนการใช�งานก#อนการใช�งาน

คิลิ�กแทุ&ป็ Documents เพั��อเพั��มไฟลิ�แรักทุ%�ใชั่�เรั%ยกเว&บไซึ่ต้� (ไฟลิ� Homepage) ในทุ%�น%5ให้�คิลิ�กป็"<ม Add… แลิ�วเพั��มไฟลิ� index.aspx

Page 19: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

1. เลิ�อกทุ%�เมน+ File -> New -> WebSite

Page 20: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

2. เลิ�อก ASP.NET Web Site ต้�5งชั่��อโป็รัเจคิ แลิะเลิ�อกภาษาทุ%�ใชั่�ในการัพั�ฒนา

Page 21: บทที่  2 ASP.NET
Page 22: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

แถบรัายการัคิ-าส��ง menu bar : เป็*นแถบแสด้งรัายการัคิ-าส��งต้4างๆ ของโป็รัแกรัม

แถบเคิรั��องม�อ (Tool Box) : เป็*นห้น�าต้4างทุ%�เก&บออบเจ&กต้�ต้4างๆ ห้รั�อ control ต้4าางๆ ทุ%�เรัาน-ามาใชั่�งานในโป็รัแกรัม

ห้น�าต้4าง Solution : เป็*นห้น�าต้4างทุ%�รัายลิะเอ%ยด้ของโซึ่ลิ+ชั่�น ( ห้ลิายๆ โป็รัเจ&กต้�รัวมก�นเรั%ยกว4า Solution ) โป็รัเจ&กต้� รัวมทุ�5ง

เรัาย�งสามารัถจ�ด้การัก�บโป็รัเจ&กต้�ได้�โด้ยการัเพั��ม ลิบ แลิะเป็ลิ%�ยนชั่��อของ Solution, Project แลิะ Form

ห้น�าต้4าง Properties : เป็*นส4วนแสด้ง แลิะ สามารัถ คิ"ณ์สมบ�ต้�ของ control ต้4าางๆ ทุ%�เรัาน-ามาใชั่�งานในโป็รัแกรัม

ส4วนส-าห้รั�บ Coding Program แลิะ ส-าห้รั�บ Design Program

Page 23: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

โคิรังสรั�างไฟลิ�โป็รัแกรัม

Page 24: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

โคิรังสรั�าง Folder

Page 25: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

โคิรังสรั�าง Folder• App_Code เป็*นโฟลิเด้อรั�ทุ%� Visual Studio 2005 สรั�างข(5นมา

อ�ต้โนม�ต้� เพั��อไว�เก&บ Class .vb ห้รั�อ .cs • App_Data เป็*นโฟเด้อรั�ทุ%�ไว�จ�ด้เก&บไฟลิ� Database ในรั+ป็แบบต้4าง ๆ

เชั่4น XML,MDB,MDF เป็*นต้�น• web.config เป็*นไฟลิ�ก-าห้นด้คิ4าคิงทุ%�อ��น ๆ ทุ%�โป็รัแกรัมสามารัถเรั%ยก

ใชั่�งานได้�ภายห้ลิ�งจากทุ%�ผู้4านการั Build ได้� น�ยมเก&บคิ4าต้4าง ๆ เชั่4น Connection ของ Database

• Default.aspx เป็*นไฟลิ�ทุ%�ใชั่�ส-าห้รั�บเก&บ Form การั Design ห้รั�อ Web Control,HTML Control ทุ�5งห้มด้ แลิะใชั่�ไฟลิ�น%5ส-าห้รั�บการั Run โป็รัแกรัม

• Default.aspx.vb เป็*นไฟลิ�ส-าห้รั�บเก&บ Class แลิะ Event ต้4าง ๆ ของไฟลิ� Default.aspx

Page 26: บทที่  2 ASP.NET

การใช�งาน การใช�งาน ASP.NETASP.NET

Page 27: บทที่  2 ASP.NET

คิลิ�กขวาทุ%�ชั่��อเพัจในห้น�าต้4าง “Solution Explorer”

เลิ�อกคิ-าส��ง “View in Browser”

การร�นเพัจ การร�นเพัจ ASP.NETASP.NET

Page 28: บทที่  2 ASP.NET

28

การเขี�ยนช%ดีค�าสั่��งใน การเขี�ยนช%ดีค�าสั่��งใน ASP.NETASP.NET

การัพั�ฒนาแอพัพัลิ�เคิชั่��นบนเว&บ ด้�วย ASP.NET ได้�อย4างม%ป็รัะส�ทุธิ�ภาพั น�กพั�ฒนาโป็รัแกรัมจะต้�องม%คิวามรั+ �พั�5นฐานต้4าง ๆ เห้ลิ4าน%5

การัสรั�างเว&บเพัจด้�วยภาษา HTML แลิะคิวามรั+ �ในการัพั�ฒนาเว&บเพัจ เบ�5องต้�นห้ลิ�กการัพั�ฒนาโป็รัแกรัมเชั่�งว�ต้ถ" (Object Oriented Programming (OOP)) ม%คิวามรั+ �แลิะคิวามเข�าใจในห้ลิ�กการัฐานข�อม+ลิ ม%คิวามเข�าใจในข�อม+ลิรั+ป็แบบ XML

Page 29: บทที่  2 ASP.NET

29

การเขี�ยนช%ดีค�าสั่��งใน การเขี�ยนช%ดีค�าสั่��งใน ASP.NETASP.NET

โด้ยสามารัถเข%ยนโคิ�ด้โป็รัแกรัมแลิะห้น�าต้าเว&บออกจากก�นได้� 2 รั+ป็แบบ คิ�อ

- Code Inline แยกเป็*นคินลิะส4วนในเอกสารัไฟลิ�เด้%ยวก�นโด้ยม%นามสก"ลิ *.aspx (บางคิรั�5งเรั%ยกว4า Code Beside)

- Code Behind เป็*นการัเก&บโคิ�ด้โป็รัแกรัมออกเป็*นไฟลิ�ต้4างห้ากโด้ยเก&บไว�ในไฟลิ�นามสก"ลิ *.vb ส4วนแสด้งผู้ลิเก&บไว�ในไฟลิ� *.aspx

Page 30: บทที่  2 ASP.NET

30

ติ�วิอย#างการเขี�ยนโปรแกรมแบบ ติ�วิอย#างการเขี�ยนโปรแกรมแบบ Code Code InlineInline

Code Inline

Page 31: บทที่  2 ASP.NET

31

ติ�วิอย#างการเขี�ยนโปรแกรมแบบ ติ�วิอย#างการเขี�ยนโปรแกรมแบบ Code Code BehindBehind

สั่#วินแสั่ดีงผล สั่#วินโปรแกรม

Page 32: บทที่  2 ASP.NET

32

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

- Directivesเป็*นส4วนทุ%�รัะบ"ข�อม+ลิทุ%�จ-าเป็*นในเอกสารัให้� compiler

ทุรัาบ โด้ยทุ%�ไม4ต้�องมาคิอยป็รัะกาศห้รั�อเรั%ยกใชั่�งานต้ลิอด้เวลิาแลิะม�กจะวางไว�ส4วนบนส"ด้ของไฟลิ� เชั่4น ร)ปแบบ

<%@ช*�อ Directive แอติทรบวิติ�ติ#างๆ>

Page 33: บทที่  2 ASP.NET

33

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

ติ�วิอย#าง Directives- Page Directive ใชั่�ก-าห้นด้คิ"ณ์สมบ�ต้�ของ

ASP.NET Page ในแต้4ลิะห้น�า

ติ�วิอย#างร)ปแบบ<%@Page Language=“VB” %>

โด้ยทุ%� Language ใชั่�ก-าห้นด้ภาษาทุ%�ใชั่�ในการัเข%ยน

โป็รัแกรัม

Page 34: บทที่  2 ASP.NET

34

ติ�วิอย#างติ�วิอย#าง Page Directive

Page 35: บทที่  2 ASP.NET

35

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

- Code Declaration Blocks เป็*นการัรัะบ"ขอบเขต้ของโคิ�ด้โป็รัแกรัมส4วนของ ASP.NET

ซึ่(�งโคิ�ด้ในส4วนน%5จะไม4ถ+กส4งไป็ให้�ก�บบรัาวเซึ่อรั�โด้ยต้รัง โด้ยเม��อม%การัใชั่�งานโคิ�ด้ในส4วนน%5จะถ+กทุ-าการัคิอมไพัลิ�ให้�เป็*น MSIL แลิะเป็*นภาษาเคิรั��อง ส4วนน%5ถ�อได้�ว4าเป็*นส4วนห้ลิ�กของโคิ�ด้ส-าห้รั�บการัป็รัะกาศโพัรัซึ่�เยอรั� , ฟ3งก�ชั่��นห้รั�อต้�วแป็รัทุ%�ต้�องการัใชั่�รั4วมก�นทุ�5งห้น�า ซึ่(�งใน 1 ห้น�าสามารัถก-าห้นด้ Code Declaration Blocks ก%� block ก&ได้� ร)ปแบบ

<Script language = “ภาษาท��ติ�องการใช�เขี�ยนโค�ดี” runat=“server”>

โค�ดีภาษาท��ติ�องการ</Script>

Page 36: บทที่  2 ASP.NET

36

ติ�วิอย#างติ�วิอย#าง Code Declaration Blocks

Page 37: บทที่  2 ASP.NET

37

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

- Code Render Blocks โคิ�ด้ทุ%�เข%ยนในส4วน <%...%>

Page 38: บทที่  2 ASP.NET

38

ติ�วิอย#างติ�วิอย#าง

Code Render Blocks

Page 39: บทที่  2 ASP.NET

39

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

- Web Forms สรั�างส4วนต้�ด้ต้4อก�บผู้+�ใชั่�ทุ-างานฝั่3� งเซึ่�รั�ฟเวอรั� แลิ�วจ(ง

ทุ-าการัสรั�างเป็*นแบบฟอรั�ม HTML ส4งไป็ย�งโป็รัแกรัมบรัาวเซึ่อรั�ของผู้+�ใชั่�

Page 40: บทที่  2 ASP.NET

40

ติ�วิอย#างติ�วิอย#าง

Web Form

Page 41: บทที่  2 ASP.NET

41

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

- Server Controls คิอนโทุรัลิทุ%�ทุ-างานฝั่3� งเซึ่�รั�ฟเวอรั�

Page 42: บทที่  2 ASP.NET

42

ติ�วิอย#างติ�วิอย#าง

Server Controls

Page 43: บทที่  2 ASP.NET

43

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

- HTML Codeโคิ�ด้ทุ%�ทุ-างานฝั่3� งบรัาวเซึ่อรั�ทุ%�น-ามาใชั่�ในการัจ�ด้รั+ป็แบบ

การัแสด้งผู้ลิบางอย4างโด้ยโคิ�ด้ทุ%�เป็*น HTML จะไม4ต้�องถ+กป็รัะมวลิผู้ลิโด้ยเซึ่�รั�ฟเวอรั� แต้4จะถ+กส4งไป็ให้�บรัาวเซึ่อรั�ของผู้+�ใชั่�โด้ยต้รัง

Page 44: บทที่  2 ASP.NET

44

ติ�วิอย#างติ�วิอย#าง

HTML Code

Page 45: บทที่  2 ASP.NET

45

โครงสั่ร�างขีองเอกสั่าร โครงสั่ร�างขีองเอกสั่าร ASP.NETASP.NET

- Server-Side Comments เป็*นส4วนทุ%�ชั่4วยในการัแทุรักห้มายเห้ต้"ห้รั�อคิ-าอธิ�บาย

โป็รัแกรัมภายในเอกสารั ASP.NET ซึ่(�งจะไม4ถ+กทุ-าการัป็รัะมวลิผู้ลิทุ%�เซึ่�รั�ฟเวอรั� แลิะจะไม4ป็รัากฏทุ%�ห้น�าเว&บเพัจด้�วยร)ปแบบ

<%--หมายเหติ%--%>

Page 46: บทที่  2 ASP.NET

46

คอนโทรลคอนโทรล (Control)(Control)

คอนโทรล (Control) ห้มายถ(ง ส4วนป็รัะกอบของโป็รัแกรัมทุ%�ทุ-าห้น�าทุ%�ต้�ด้ต้4อก�บผู้+�ใชั่�งาน เชั่4น ป็"<มคิ-าส��ง ชั่4องรั�บข�อคิวาม เชั่&คิบAอกซึ่� เป็*นต้�น คิอนโทุรัลิน�5นน�บได้�ว4าเป็*นส��งทุ%�เพั��มเต้�มมาจาก ASP แลิะคิ-าส��งทุ%�ใชั่�สรั�างคิอนโทุรัลิจะม%รั+ป็แบบคิลิ�ายคิลิ(งก�บภาษา XML

Page 47: บทที่  2 ASP.NET

47

ประโยชน�ขีองคอนโทรลประโยชน�ขีองคอนโทรล ลดีการเขี�ยนโปรแกรมท��ซั�บซั�อน

คิอนโทุรัลิน�5นชั่4วยลิด้การัเข%ยนโป็รัแกรัมทุ%�ซึ่�บซึ่�อนแลิะทุ-าให้�การัเข%ยนโป็รัแกรัมง4ายข(5น เชั่4น การัด้(งข�อม+ลิจากฐานข�อม+ลิมาแสด้งในต้ารัาง

ม�การแปลภาษาท��ฝั่1� งเซัร�ฟเวิอร�ท�"งหมดีคิอนโทุรัลิน�5นจะถ+กแป็ลิทุ%�ฝั่3� งเซึ่�รั�ฟเวอรั�ทุ�5งห้มด้ จ(งลิด้

ภารัะการัทุ-างานทุ%�ฝั่3� งผู้+�ใชั่�งาน (ไคิลิเอ&นต้�) แลิะสามารัถแป็ลิภาษา HTML ทุ%�ป็กต้�ถ+กแป็ลิงทุางฝั่3� งผู้+�ใชั่�ให้�ไป็แป็ลิทุางฝั่3� งเซึ่�รั�ฟ Bเวอรั�แทุนได้� ทุ-าให้�คิ4าต้4าง ๆ จะถ+กเก&บไว�ทุ%�ฝั่3� งเซึ่�รั�ฟเวอรั�มากกว4าฝั่3� งผู้+�ใชั่�

Page 48: บทที่  2 ASP.NET

48

ประโยชน�ขีองคอนโทรลประโยชน�ขีองคอนโทรล ร)ปแบบหน�าเวิ3บเพัจท��เกดีจากคอนโทรลม�ควิามเหมาะสั่ม

เน��องจากคิอนโทุรัลิจะถ+กแป็ลิทุ%�ฝั่3� งเซึ่�รั�ฟเวอรั� ด้�งน�5นคิอนโทุรัลิสามารัถต้รัวจสอบด้+ว4าบรัาวเซึ่อรั�ทุางฝั่3� งผู้+�ใชั่�ใชั่�โป็รัแกรัมใด้ แลิ�วทุ-าการัแป็ลิงเป็*นไฟลิ� HTML ทุ%�เห้มาะสม

ส-าห้รั�บโป็รัแกรัมบรัาวเซึ่อรั�น�5น ๆ ได้�ซึ่(�งส4วนน%5น�บเป็*นป็รัะโยชั่น�อย4างย��ง เพัรัาะในอนาคิต้การัใชั่�อ�นเทุอรั�เนต้ไม4ได้�จ-าก�ด้อย+4ในคิอมพั�วเต้อรั�เสมอไป็ เว&บไซึ่ต้�อาจถ+กเรั%ยกใชั่�โด้ยโทุรัศ�พัทุ�ม�อ

ถ�อ ห้รั�อเคิรั��อง PDA เป็*นต้�น

Page 49: บทที่  2 ASP.NET

49

การใช�งานคอนโทรลการใช�งานคอนโทรลการัใชั่�งานในแต้4ลิะคิอนโทุรัลิต้�องเข�าใจถ(ง

- คิ"ณ์สมบ�ต้� (Property) ของคิอนโทุรัลิ- การัทุ-างาน (Method) ห้รั�อ code ทุ%�แต้4ลิะ

คิอนโทุรัลิสามารัถทุ-าได้�- เห้ต้"การัณ์� (Event) ทุ%�เก�ด้ข(5นก�บแต้4ลิะคิอนโทุรัลิ

การก�าหนดีค%ณสั่มบ�ติ การก�าหนดีค%ณสั่มบ�ติ (Property) (Property) ให�ก�บคอนโทรลให�ก�บคอนโทรลร)ปแบบ

ช*�อคอนโทรล.ค%ณสั่มบ�ติ

Page 50: บทที่  2 ASP.NET

Control Control ใน ใน ASP.NETASP.NET

Standard Controls          กลิ"4มคิอนโทุรัลิพั�5นฐานป็รัะเภทุ Web Server Control ส-าห้รั�บสรั�างฟอรั�มทุ��วไป็ เชั่4น Button Label ห้รั�อ TextBox เป็*นต้�น

HTML Controls         กลิ"4มคิอนโทุรัลิ HTML ทุ%�ใชั่�ส-าห้รั�บเป็ลิ%�ยนแทุ&ก HTML เป็*น HTML Server Control ซึ่(�งสามารัถทุ-างานทุ%�ฝั่3� ง Server ได้�

Data Controls             คิ�อ กลิ"4มคิอนโทุรัลิทุ%�เก%ยวก�บการัใชั่�งานฐานข�อม+ลิ แบ4งออกเป็*น2กลิ"4ม คิ�อ DataSource Control เป็*นกลิ"4มคิอนโทุรัลิทุ%�ใชั่�ต้�ด้ต้4อก�บแห้ลิ4งข�อม+ลิเพั��อเก&บข�อม+ลิทุ%�ต้�องการั แลิะ DataBound Control เป็*นกลิ"4มคิอนโทุรัลิทุ%�น-าข�อม+ลิจากแห้ลิ4งข�อม+ลิมาแสด้งบนเพัจ

Page 51: บทที่  2 ASP.NET

Control Control ใน ใน ASP.NETASP.NET

Validation Controls         กลิ"4มคิอนโทุรัลิทุ%�ใชั่�ต้รัวจสอบคิวามถ+กต้�องของข�อม+ลิทุ%�จะส4งไป็ทุ-างานทุ%�ฝั่3� ง Server

Navigation Controls         กลิ"4มคิอนโทุรัลิทุ%�ใชั่�เส�นทุางการัต้�ด้ต้4อของแต้4ลิะเพัจ เชั่4น Tree Viws

Login Controls         กลิ"4มคิอนโทุรัลิทุ%�ใชั่�ในการั Login การัเป็ลิ%�ยน Password แลิะการัลิงทุะเบ%ยน

Web Parts Controls         กลิ"4มคิอนโทุรัลิทุ%�ใชั่�สรั�างคิวามเป็*นส4วนต้�ว

AJAX Extensions Controls         กลิ"4มคิอนโทุรัลิทุ%�ใชั่�งานก�บเทุคิโนโลิย% AJAX

Page 52: บทที่  2 ASP.NET

Control Control ใน ใน ASP.NETASP.NET

Reporting         กลิ"4มคิอนโทุรัลิทุ%�ใชั่�ส-าห้รั�บการัสรั�างรัายงาน

Page 53: บทที่  2 ASP.NET

53

Server ControlServer Control

Server Control เป็*นคิอนโทุรัลิกลิ"4มห้น(�งของ ASP.NET ถ+กสรั�างข(5นด้�วยจ"ด้ม"4งห้มายทุ%�แต้กต้4างจาก HTML Control เน��องด้�วย HTML control ม%คิวามส�มพั�นธิ�แบบห้น(�งต้4อห้น(�งก�บ HTML element ในห้น�าเว&บเพัจ ในขณ์ะทุ%� Server Control ม%คิวามซึ่�บซึ่�อนมากกว4า โด้ยคิอนโทุรัลิห้น(�ง ๆ สามารัถแสด้งผู้ลิเป็*น แทุ&ก HTML ได้�มากกว4า 1ชั่น�ด้

control ในกลิ"4มน%5เม��อถ+กน-าไป็วางลิงบน form จะถ+กแป็ลิงให้�อย+4ในรั+ป็ของ Tag แลิะเก&บไว�ในไฟลิ� .aspx ให้�โด้ยอ�ต้โนม�ต้� โด้ยทุ%�แต้4ลิะ tag จะก-าห้นด้อย+4ภายในเคิรั��องห้มาย “< >” ทุ%�ข(5นต้�นด้�วย “asp:”หมายเหติ% โด้ยจะต้�องก-าห้นด้ไว�ภายใน block ของ Tag “<Form>… </Form>”

Page 54: บทที่  2 ASP.NET

54

Server ControlServer Control

ร)ปแบบท�� 1

โด้ยทุ%� name ห้มายถ(งชั่��อของ control

control-type ห้มายถ(งป็รัะเภทุของ control

property-set ห้มายถ(งคิ"ณ์สมบ�ต้�ทุ%�ก-าห้นด้ให้� control

value ห้มายถ(งคิ4าทุ%�ต้�องการัให้�ป็รัากฏบน control

<asp: control-type id = name runat = “server” [property-set]> value </asp:control-type>

เช#น <asp:Label ID="Label2" runat="server" Text="Label" Width="171px"></asp:Label>

Page 55: บทที่  2 ASP.NET

55

Server ControlServer Control

ผลล�พัธ์�

Page 56: บทที่  2 ASP.NET

56

Server ControlServer Control

ร)ปแบบท�� 2

โด้ยทุ%� name ห้มายถ(งชั่��อของ controlcontrol-type ห้มายถ(งป็รัะเภทุของ

controlproperty-set ห้มายถ(งคิ"ณ์สมบ�ต้�ทุ%�

ก-าห้นด้ให้� controlvalue ห้มายถ(งคิ4าทุ%�ต้�องการัให้�ป็รัากฏบน

controldisplay-Property ห้มายถ(ง property ต้4างๆ

ทุ%�ใชั่�แสด้งผู้ลิ

<asp: control-type id = name runat = “server” display-Property = value [property-set]/>

เช#น <asp:Button ID="Button1" runat="server" Text="Button" />

Page 57: บทที่  2 ASP.NET

57

Server ControlServer Control

ผลล�พัธ์�

Page 58: บทที่  2 ASP.NET

58

ประเภทขีอง ประเภทขีอง Server ControlServer Control

Label Control เป็*นคิอนโทุรัลิทุ%�ใชั่�แสด้งข�อคิวามต้4าง ๆ ในห้น�าเว&บเพัจ

ร)ปแบบ<asp:Label id =“ช*�อคอนโทรล” Text=“ ขี�อควิามท��ติ�องการ

แสั่ดีง” runat = “server”/>

หมายเหติ% การัต้�5งชั่��อ (id) ของ Label Control คิวรัจะน-าห้น�าชั่��อด้�วย lbl เชั่4น lblData เป็*นต้�น

Page 59: บทที่  2 ASP.NET

59

ประเภทขีอง ประเภทขีอง Server ControlServer Control

ค%ณสั่มบ�ติ ค�าอธ์บายid ชั่��อของ Label

Text อ4านคิ4าห้รั�อก-าห้นด้คิ4าข�อคิวามทุ%�จะแสด้งผู้ลิในบรัาวเซึ่อรั�

BorderStyle ก-าห้นด้รั+ป็แบบของเส�นขอบFont ก-าห้นด้รั+ป็แบบของต้�วอ�กษรัใน Label

Backcolor ก-าห้นด้ส%ของพั�5นห้ลิ�ง Label

ค%ณสั่มบ�ติขีอง Label Control ท��สั่�าค�ญ

Page 60: บทที่  2 ASP.NET

60

ประเภทขีอง ประเภทขีอง Server ControlServer Control

TextBox Controlเป็*นคิอนโทุรัลิทุ%�ใชั่�สรั�างชั่4องรั�บข�อคิวาม/รัห้�สผู้4าน ห้รั�อ

ชั่4องรั�บข�อคิวามแบบ TextArea ทุ%�สามารัถรั�บข�อม+ลิได้�มากกว4า 1 บรัรัทุ�ด้ โด้ยจะรัวมเอาคิวามสามารัถของคิอนโทุรัลิในกลิ"4ม HTML ,Server control ได้�แก4 HTMLInput Text แลิะ HTML TextArea เข�ามาไว�ด้�วยก�น

ร)ปแบบ<asp:TextBox id =“ช*�อคอนโทรล” Text=“ ขี�อควิามท��ติ�องการแสั่ดีง” runat = “server”/>

หมายเหติ% การัต้�5งชั่��อ (id) ของ TextBox Control คิวรัจะน-าห้น�าชั่��อด้�วย txt เชั่4น txtData เป็*นต้�น

Page 61: บทที่  2 ASP.NET

61

ประเภทขีอง ประเภทขีอง Server ControlServer Control

ค%ณสั่มบ�ติ ค�าอธ์บายid ชั่��อของ TextBox

Text อ4านคิ4าห้รั�อก-าห้นด้คิ4าข�อคิวามทุ%�จะแสด้งผู้ลิใน TextBox

TextMode อ4านคิ4าห้รั�อก-าห้นด้คิ4าชั่น�ด้ของ TextBox ซึ่(�งสามารัถเป็*น Multiline = แสด้งห้ลิายบรัรัทุ�ด้ Password = แสด้งบรัรัทุ�ด้เด้%ยวแลิะแสด้งข�อคิวามภายในเป็*น * SingleLine(Default) = แสด้งบรัรัทุ�ด้เด้%ยว

MaxLenght

อ4านคิ4าห้รั�อก-าห้นด้คิ4าจ-านวนต้�วอ�กษรัส+งส"ด้ทุ%�บรัรัจ"ใน TextBox

ค%ณสั่มบ�ติขีอง TextBox Control ท��สั่�าค�ญ

Page 62: บทที่  2 ASP.NET

62

ประเภทขีอง ประเภทขีอง Server ControlServer Control

Button Controlเป็*นคิอนโทุรัลิทุ%�ใชั่�สรั�างป็"<มทุ-าห้น�าทุ%�เป็*นป็"<มคิ-าส��งห้รั�อป็"<ม

ส-าห้รั�บส4งข�อม+ลิร)ปแบบ

<asp:Button id =“ช*�อคอนโทรล” Text=“ ขี�อควิามท��ติ�องการแสั่ดีง” runat = “server”/>

หมายเหติ% การัต้�5งชั่��อ (id) ของ Button Control คิวรัจะน-าห้น�าชั่��อด้�วย btn เชั่4น btnCalculate เป็*นต้�น

Page 63: บทที่  2 ASP.NET

63

ประเภทขีอง ประเภทขีอง Server ControlServer Control

ค%ณสั่มบ�ติ ค�าอธ์บายid ชั่��อของ Button

Text อ4านคิ4าห้รั�อก-าห้นด้คิ4าข�อคิวามทุ%�จะแสด้งผู้ลิในป็"<ม

ค%ณสั่มบ�ติขีอง Button Control ท��สั่�าค�ญ

Page 64: บทที่  2 ASP.NET

64

ประเภทขีอง ประเภทขีอง Server ControlServer Control

CheckBox Controlเป็*นคิอนโทุรัลิทุ%�ใชั่�สรั�างเชั่&คิบ&อกซึ่� ผู้+�ใชั่�สามารัถคิลิ�กให้�ม%

สถานะเป็*น เลิ�อก ห้รั�อไม4เลิ�อก ได้�ร)ปแบบ

<asp:CheckBox id =“ช*�อคอนโทรล” Text=“ ขี�อควิามท��ติ�องการแสั่ดีง” runat = “server”/>

หมายเหติ% การัต้�5งชั่��อ (id) ของ CheckBox Control คิวรัจะน-าห้น�าชั่��อด้�วย chk เชั่4น chkData เป็*นต้�น

Page 65: บทที่  2 ASP.NET

65

ประเภทขีอง ประเภทขีอง Server ControlServer Control

ค%ณสั่มบ�ติ ค�าอธ์บายid ชั่��อของ CheckBox

Text อ4านคิ4าห้รั�อก-าห้นด้ข�อคิวามทุ%�จะแสด้งผู้ลิต้4อจากชั่4องกาเคิรั��องห้มาย

Checked อ4านคิ4าห้รั�อก-าห้นด้คิ4าว4าชั่4อง CheckBox ถ+กกาเคิรั��องห้มายห้รั�อไม4 ซึ่(�งสามารัถเป็*น - True = ถ+กกาเคิรั��องห้มาย - False = ไม4ถ+กกาเคิรั��องห้มาย

TextAlign ก-าห้นด้การัจ�ด้เรั%ยงข�อคิวามว4าจะอย+4ด้�านซึ่�ายห้รั�อขวาของชั่4องกาเคิรั��องห้มายห้ากไม4ก-าห้นด้จะเป็*นด้�านขวาโด้ยป็รั�ยาย - Right = ด้�านขวา - Left = ด้�านซึ่�าย

ค%ณสั่มบ�ติขีอง CheckBox Control ท��สั่�าค�ญ

Page 66: บทที่  2 ASP.NET

66

ประเภทขีอง ประเภทขีอง Server ControlServer Control

RadioButton controlเป็*นคิอนโทุรัลิทุ%�ใชั่�สรั�างเรัด้�โอ ผู้+�ใชั่�สามารัถคิลิ�กป็"<มให้�ม%

สถานะเป็*น เลิ�อก ได้�เพั%ยงป็"<มเด้%ยวจากป็"<มเรัด้�โอทุ%�ม%ทุ�5งห้มด้ร)ปแบบ

<asp:RadioButton id =“ช*�อคอนโทรล”

Text=“ ขี�อควิามท��ติ�องการแสั่ดีง”

runat = “server”/>

Page 67: บทที่  2 ASP.NET

67

ประเภทขีอง ประเภทขีอง Server ControlServer Control

ค%ณสั่มบ�ติ ค�าอธ์บายid ชั่��อของ RadioButton

Text อ4านคิ4าห้รั�อก-าห้นด้คิ4าข�อคิวามทุ%�จะแสด้งผู้ลิข�าง RadioButton

Checked อ4านคิ4าห้รั�อก-าห้นด้คิ4าว4าชั่4อง Radio น%5ถ+กเลิ�อกห้รั�อไม4 ซึ่(�งสามารัถเป็*น - True = ถ+กเลิ�อก - False = ไม4ถ+กเลิ�อก

TextAlign ก-าห้นด้การัจ�ด้เรั%ยงข�อคิวามว4าจะอย+4ด้�านซึ่�ายห้รั�อขวาของ RadioButtonห้ากไม4ก-าห้นด้จะเป็*นด้�านขวาโด้ยป็รั�ยาย - Right = ด้�านขวา - Left = ด้�านซึ่�าย

ค%ณสั่มบ�ติขีอง RadioButton Control ท��สั่�าค�ญ