การเขียนโปรแกรมเชิงวัตถุ (asp.net c#) day 4

การเขียนโปรแกรมเชิงวัตถุ (asp.net c#) กับการติดต่อฐานข้อมูล MSSql (Microsoft Sql Server 2012)

เราจะใช้ Microsoft.Practices.EnterpriseLibrary เพื่อเชื่อมต่อ Database โดยโหลด ที่นี่ bin

แตกไฟล์ที่ดาวโหลด bin.zip ด้านบนรอไว้
เปิด VS ขึ้นมาแล้ว
Create New Project
เลือก ASP.NET Web Application (.NET Framework) แล้วกด next
ตั้งชื่อ Project Name ว่า ConnectDB
Location ใส่ C:\OOP แล้วกด Create
ให้เลือก Empty แล้วกด Create
เมื่อสร้างโปรเจ็คแล้วก็ให้ไปที่ Solution Explorer แล้วคลิกขวาที่ชื่อ ConnectDB แล้วก็กด Add->New Item
เลือก Web Forms Master Page ตั้งชื่อ Main.Master
ทำการเพิ่มเพจลูกโดย คลิกขวาที่ ConnectDB อีกรอบแล้วเลือก Add->New Item แล้ว Web Form with Master Page และตั้งชื่อ Default.aspx
ให้เลือก Main.Master แล้วกด OK
เลือกไฟล์ Default.aspx แล้วลองกด F5 เพื่อรันโปรเจ็ค
ลองแก้ไขไฟล์ Default.aspx พิมพ์สวัสดีชาวโลก แล้ว save แล้วลองรีเฟรซหน้าจะเห็นข้อความขึ้น (สามารถรันได้เลยโดยไม่ต้อง stop server เพราะแก้ไขแค่หน้า design)
โหลด Bootstrap เข้ามาใช้งานในโปรเจ็ค link https://getbootstrap.com/ ไปที่เมนู Download แล้วกด Download
แล้วแตกไฟล์พร้อม copy folder ใน bootstrap ที่โหลดมา คือ css และ js (กด copy แล้วไปกด paste ที่ project ConnectDB)
หลังจากนั้นกลับมาหน้า design ของ Main.Master ลาก bootstrap.min.css กับ bootstrap.bundle.min.cs
ทดสอบว่าใช้ bootstrap ได้ไหมให้เปิดไฟล์ default.aspx แล้วลองพิมพ์ <a href=”..” class=’btn btn-primary’>GO</a> จะได้ปุ่มที่มี css สวยงามดังรูป
Add Font Awaresome เพื่อใช้ icon https://fontawesome.com/download
พอดาวน์โหลดมาแล้วให้แตกไฟล์แล้วลากมาวางในโปรเจ็คหลังจากนั้นให้หาไฟล์ all.css ลากไปไว้ใน Main.Master ตามภาพ
ทดสอบการใช้งาน fontawaresome โดยการใช้ icon มาที่หน้า default.aspx ตรงปุ่ม go ที่สร้างให้แก้ไขดังภาพ
(เราสามารถค้นหา icon ได้จากหน้า https://fontawesome.com/search?p=1 หรือ หน้า /icon เลือก all คลิกด้านซ้ายว่า free ด้วย)
เปิด MS SQL Server Management (ตรงปุ่ม start พิมพ์ค้นหา SQL Server manage studio) เลือก Server Name ตั้งต้นหรือเลือกใส่ . เข้าไปแล้วกด Connect ดังภาพ
คลิกขวาที่ ที่ด้านบนของ server แล้วเลือก properties แล้วเลือก security ดูว่ามีการปรับให้ Server Authentication Mode เป็น SQL Server and Windows Authentication Mode หรือยัง
เริ่มสร้าง db กาง Server ออกมาแล้วตรง Database ให้คลิกขวาแล้วเลือก New Database แล้วตั้งชื่อเป็น mydb แล้วกดปุ่ม OK
หลังจากนั้นกดไปที่ database “mydb” แล้วกางออก แล้วจะเห็น Tables ให้คลิกขวาแล้ว New Table ทำการแอด Field หรือ Column ของ Table เริ่มสร้าง
MemberID | DataType=int | เลื่อนมาด้านล่าง identity specification ให้ดับเบิ้ลคลิกที่ Is Identity (มันจะเริ่มต้น auto incresement) หลังจากนั้นให้เลือกที่รูปกุนแจระบุว่า Field เป็น PK
สร้าง Field NameTH กับ SurnameTH ระบุเป็น nvarchar (100) แล้วสร้าง Field RegisDate ระบุเป็น datetime แล้วปรับ Default Value or Binding เป็น getdate() เพื่อให้ออโต้ลงวันที่ไปใน db อัตโนมัติ

หลังจากนั้นกด save แล้วตั้งชื่อ Member แล้วกดปุ่ม OK
กรณีที่ต้องการแก้ไข Table เราคลิกขวาที่ Table Member แล้วเลือก Design ก็จะสามารถแก้ไข Field ได้แต่ถ้าแก้ไขไม่ได้ แสดงว่าต้องไปเปิดใน Tools->Options->Design ตรง Prevent saving change that require table re-creation ออกก่อน
ไปที่ Security ของ Server มันจะอยู่ด้านนอกเมนู Database (ใน Database เองจะมีของตัวเองด้วย) มันจะอยู่ระดับเดียวกับ database แล้วคลิกกางออกจะเจอ Logins แล้วคลิกขวาเลือก Add New Login
ตั้งชื่อ Login name และเลือก SQL Server Authentication แล้วติกเอา Enforce… ออก ดังภาพ
ให้คลิกขวาที่ usr1 ที่สร้างอีกรอบ เลือก Properties เสร็จแล้วเลือกที่ User Mapping แล้วติก ที่ mydb แล้วด้านล่างตรง Database role…. เลือก db_owner แล้วกด OK

เมื่อกด OK แล้วจะสังเกตุว่าเมื่อกลับมาที่ mydb ตรง security->User จะมี usr1 โผล่มาแล้ว วิธีทดสอบ ให้ลอง Logout หรือ discornect server แล้ว join ด้วย usr1 แทน
วิธีทดสอบหลังจากที่ disconect ให้กด connect แล้ว server name เป็น “.” แล้วเลือก Authentication เป็น SQL Server Authentication แล้วใส่ตรง Login / Password เป็น usr1

หลังจากนั้นจะสามารถ Connect ได้และสามารถกาง mydb ออกมาและไปจัดการ Table ได้ แต่ถ้าเราลองเข้าไป database อื่นจะเข้าไม่ได้เพราะไม่มีสิทธิเข้าถึง (ถูกระบุไว้ตอน Mapping)
กลับมาทึ่ VS กดคลิกขวาที่โปรเจค ConnectDB เลือก Add->References แล้วเลือก Browse แล้วกด Browse.. หา Folder bin ที่เรา Download แล้วแตกไฟล์มาเลือกไฟล์ทั้งหมดกด Add
ไปกำหนดการเรียกใช้db เช่น connection string ในไฟล์ Web.config เพิ่มโค้ดลงไป<configSections>
<section name=”loggingConfiguration” type=”Microsoft.Practices.EnterpriseLibrary.Logging.Configuration.LoggingSettings, Microsoft.Practices.EnterpriseLibrary.Logging” />
<section name=”exceptionHandling” type=”Microsoft.Practices.EnterpriseLibrary.ExceptionHandling.Configuration.ExceptionHandlingSettings, Microsoft.Practices.EnterpriseLibrary.ExceptionHandling” />
<section name=”dataConfiguration” type=”Microsoft.Practices.EnterpriseLibrary.Data.Configuration.DatabaseSettings, Microsoft.Practices.EnterpriseLibrary.Data” /></configSections>
<dataConfiguration defaultDatabase=”evaluationConnectionString” />
<connectionStrings><add name=”evaluationConnectionString” connectionString=”Data Source=.;Initial Catalog=mydb;Persist Security Info=True;User ID=usr1;Password=usr1″ providerName=”System.Data.SqlClient” />
</connectionStrings>
ทดสอบโดยกลับมาที่หน้า Default.aspx.cs พิพม์โค้ดในการ query db ดังภาพ แล้วลองรัน ถ้ามีตัวเลขแสดง ถือว่าถูกต้อง
เมื่อทดสอบจะเห็นว่าตัวเลขแสดงขึ้นมาซึ่งไปดึงข้อมูลจาก db มาแสดง
ให้คลิกขวาที่โปรเจคแล้ว add->new item แล้วเลือก c# ทำการเลือก class แล้วตั้งชื่อ DAL.cs แล้วกด Add หลังจากนั้นก็พิมพ์โค้ดตามนี้
using Microsoft.Practices.EnterpriseLibrary.Data;
using System.Data.Common;
using System.Data;using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;namespace ConnectDB
{public class DAL
{
public Database db;
public string sql;
public DbCommand dbc;
public DataSet ds;public DataSet LoadMember()
{
db = DatabaseFactory.CreateDatabase();
sql = @”SELECT * FROM Member”;
dbc = db.GetSqlStringCommand(sql);
ds = db.ExecuteDataSet(dbc);
return ds;}
}
}
กลับมาแก้ไขหน้า Default.aspx เรียกใช้ DAL ดังภาพ
จะสังเกตุว่าสามารถเรียกข้อมูลจาก db ได้เหมือนกัน แต่วิธีนี้จะสะดวกกว่าตรงที่เราสามารถร่วมการเรียก db ไว้ที่ไฟล์ DAL ไฟล์เดียว
กลับมาที่หน้า defult.aspx ทำปุ่ม link ไปยังหน้า Add NewMember.aspx โค้ดดังนี้
<a href=”NewMember.aspx” class=’btn btn-primary’><i class=”fa-solid fa-user-plus”></i> เพิ่มสมาชิก</a> แล้ว Save
ไปที่ Solution Explorer ตรงโปรเจค ConnectDB ให้ คลิกขวาแล้วเลือก Add->New Item เลือก Web->Web Form with Master Page ตรง Name ตั้งเป็น NewMember.aspx แล้วกด Add แล้วเลือก Main.Master กด Ok
โค้ดหน้า NewMember.aspx
<%@ Page Title=”” Language=”C#” MasterPageFile=”~/Main.Master” AutoEventWireup=”true” CodeBehind=”NewMember.aspx.cs” Inherits=”ConnectDB.NewMember” %>
<asp:Content ID=”Content1″ ContentPlaceHolderID=”head” runat=”server”>
</asp:Content>
<asp:Content ID=”Content2″ ContentPlaceHolderID=”ContentPlaceHolder1″ runat=”server”>
<div class=”mb-3″>
ชื่อ
<asp:TextBox ID=”txtNameTH” runat=”server” CssClass=”form-control”></asp:TextBox>
</div><div class=”mb-3″>
นามสกุล
<asp:TextBox ID=”txtSurnameTH” runat=”server” CssClass=”form-control”></asp:TextBox>
</div><div class=”mb-3″>
อายุ
<asp:TextBox ID=”txtAge” runat=”server” CssClass=”form-control”></asp:TextBox>
</div><div class=”mb-3″>
Username
<asp:TextBox ID=”txtUsername” runat=”server” CssClass=”form-control”></asp:TextBox>
</div><div class=”mb-3″>
Password
<asp:TextBox ID=”txtPassword” runat=”server” CssClass=”form-control” TextMode=”Password”></asp:TextBox>
</div>

<asp:Button ID=”btnSave” OnClick=”btnSave_Click” runat=”server” Text=”Save” />

</asp:Content>
ไปสร้างไฟล์ Model ที่ชื่อ Member ขึ้นมาเพื่อใช้กับ DAL โดยไปที่โปรเจคคลิกขวาเลือก Add->New Item เลือก c# ทำการ add class ใส่ชื่อ ModelMember.cs แล้วพิมพ์โค้ดตามนี้
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;namespace ConnectDB
{
public class ModelMember
{
public string NameTH { get; set; }
public string SurnameTH { get; set; }
public int Age { get; set; }
public string Username { get; set; }
public string Password { get; set; }}
}
ไปที่ DAL.cs ทำการเพิ่ม ฟังชั่นบันทึก Member ลง DB
public void InsertNewMember(ModelMember member)
{
db = DatabaseFactory.CreateDatabase();
sql = @”INSERT INTO Member(NameTH,SurnameTH,Age,Username,Password)VALUES(
@NameTH,@SurnameTH,@Age,@Username,@Password)”;
dbc = db.GetSqlStringCommand(sql);
db.AddInParameter(dbc, “NameTH”, DbType.String, member.NameTH);
db.AddInParameter(dbc, “SurnameTH”, DbType.String, member.SurnameTH);
db.AddInParameter(dbc, “Age”, DbType.Int16, member.Age);
db.AddInParameter(dbc, “Username”, DbType.String, member.Username);
db.AddInParameter(dbc, “Password”, DbType.String, member.Password);
db.ExecuteNonQuery(dbc);
}
กล้บมาที่หน้า NewMember.aspx.cs มีโค้ดดังนี้
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;namespace ConnectDB
{
public partial class NewMember : System.Web.UI.Page
{protected void Page_Load(object sender, EventArgs e)
{

}

protected void btnSave_Click(object sender, EventArgs e)
{
DAL dal = new DAL();
ModelMember member = new ModelMember();
member.NameTH = txtNameTH.Text;
member.SurnameTH = txtSurnameTH.Text;
member.Age = int.Parse(txtAge.Text);
member.Username = txtUsername.Text;
member.Password = txtPassword.Text;
bool chkSave=dal.InsertNewMember(member);
if (chkSave == true)
{
Response.Redirect(“default.aspx”);
}
else
{
Label1.Text = “Error : ไม่สามารถบันทึกได้”;
}

}
}
}
ตัวอย่าง Source Code ที่เรียนทั้งหมด
ConnectDB