ASP.NET & Visual Studio 2010 - Create New File ใน Tool ของ Visual Studio 2010มี Item และ Control ให้เลือกใช้มากมายครับ เกินกว่าจะเข้าใจได้ทุกตัว หัวข้อนี้จะเป็นการเพิ่มไฟล์ต่าง ๆ เข้ามาภายในโปรเจค โดยผมจะแนะนำเพียงไฟล์ที่เราได้ใช้งานบ่อย ๆ เท่านั้นครับ
เปิดโปรแกรมได้ที่
Visual Studio 2010
Start -> Programs -> Microsoft Visual Studio 2010 -> Microsoft Visual Studio 2010
ASP.NET & Visual Studio 2010 - Create New Project

Screen Visual Studio 2010
1. การเพิ่ม WebForm (.aspx) (Create Web Form)

คลิกขวาที่ Project เลือก Add New Item

กำหนดชื่อ Web Form

Web Form จะถูกสร้างและไฟล์ .aspx.vb จะถูกสร้างขึ้นมาด้วยครับ
โครงสร้างของ .aspx และ .aspx.vb ซึ่งเป็นไฟล์ที่ทำงานคู่กัน ถ้าเราเปิดไฟล์ .aspx เราจะเห็นว่ามีคำสั่งที่เชื่อมโยง 2 ไฟล์นี้อยู่ครับ
MyWebForm.aspx
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="MyWebForm.aspx.vb" Inherits="MyWebForm" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
MyWebForm.aspx.vb
Partial Class MyWebForm
Inherits System.Web.UI.Page
End Class
เหตุผลที่ Visual Studio 2010 ทำการแยกไฟล์เป็น 2 หรือ 3 ไฟล์เพราะต้องการที่จะแยกในส่วนของ Web Form และในส่วนของ Coding ไว้คนล่ะส่วนครับ และทุก ๆ ครั้งที่มีการสร้าง Control หรือ Element ต่าง ๆ ใน .aspx ส่วนของ .aspx.vb จะสามารถเรียกใช้งาน Control ทั้งหมดที่อยู่ในภาย Web Form
เพิ่มเติมอีกนิดครับ
.vb จะเป็นโครงสร้างนามสกุลของภาษา Visual Basic .NET ครับ แต่ถ้าในส่วนของภาษา C# จะเป็น .cs แทนครับ
<%@ Page language="c#" AutoEventWireup="false" CodeFile="MyWebForm.aspx.cs" Inherits="MyWebForm" %>
2. การเพิ่ม Web User Control (.ascx) (Create Web User Control)
User Control (.ascx) เป็นไฟล์ที่ใช้จัดเก็บ Form , Control และ Element เหมือน ๆ กับ Web Form (.aspx) ครับ แต่แตกต่างกันที่ Web User Control (.ascx) จะถูกเรียกใช้งานโดย Web Form (.ascx) ไม่สามารถทำการ Run โปรแกรมได้จากไฟล์นี้ครับ

คลิกขวาที่ Project เลือก Add New Item

กำหนดชื่อ Web User Control

ไฟล์ที่ได้ซึ่งมีโครงสร้างเหมือนกับ Web Form (.aspx)
MyWebUserControl.ascx.vb
<%@ Control Language="VB" AutoEventWireup="false" CodeFile="MyWebUserControl.ascx.vb" Inherits="MyWebUserControl" %>
MyWebUserControl.ascx.vb
Partial Class MyWebUserControl
Inherits System.Web.UI.UserControl
End Class
ASP.NET & Visual Studio 2010 - User Control
4. การเพิ่ม Class .vb (Create Class)
เป็นไฟล์สำหรับเก็บ Class อื่น ๆ ที่ต้องการสร้างขึ้นมาใช้ภายใน Project

คลิกขวาที่ Project เลือก Add New Item

กำหนดชื่อ Class

โปรแกรมแสดงเตือนว่าไฟล์ .vb หรือ .cs จะถูกจัดเก็บไว้ในโฟเดอร์ App_Code

ไฟล์ Class ถูกสร้างเก็บไว้ที่ App_Code
กำหนดชื่อ Class และนามสกุล .vb ถ้าเป็นในภาษา C# จะเป็น .cs ในที่นี้ผมจะสร้างเป็น clsConnectDB.vb ซึ่งผมวางแผนจะจัดเก็บคำสั่งการ Connect กับ Database ไว้ใน Class นี้
clsConnectDB.vb
Imports Microsoft.VisualBasic
Public Class clsConnectDB
End Class
ASP.NET & Visual Studio 2010 - File Structure