ဒီ Tutorials ကို မစခင္မွာ ေရွ႕မွာ တင္ခဲ့တဲ့ ပို႔စ္ႏွစ္ခုကို အရင္ဖတ္ဖို႔ လိုပါလိမ့္မယ္။ ဒါေၾကာင့္ အဲဒီ ပို႔စ္ႏွစ္ခုရဲ႕ လင့္ကို ျပန္ညႊန္းလိုက္ပါတယ္။

• Introduction to ASP.NET MVC
• Introduction to ASP.NET MVC Part II

Asp.net MVC နဲ႔ sql database ကို အသံုးျပဳျပီးေတာ့ create, edit, delete ကို ျပဳလုပ္ရာမွာ ဘယ္ေလာက္ လြယ္ကူတယ္ ဆိုတာကို ေတြ႔ရမွာပါ။ NORTHWND Database နဲ႔ ဥပမာထားျပီးေတာ့ လုပ္ၾကည့္ရေအာင္။ Asp.net MVC 2 Empty Web Application ကိုအသစ္ယူလိုက္ပါ။ Database ေတြအတြက္ App_Data folder မရွိေသးတဲ့အတြက္ အသစ္ေဆာက္ေပးရပါမယ္။

App_Data folder ေပၚမွာ Right Click လုပ္ၿပီးေတာ့ Add ကေန တစ္ဆင့္ Existing Item ကို ေရြးပါ။

Northwind Database ကို ေရြးေပးလိုက္ပါ။ (Northwind Database အဆင္သင့္ မရွိေသးဘူးဆိုရင္ေတာ့ Microsoft Web Site ထဲကေန Download ရယူႏိုင္ပါတယ္။)

App_Data ထဲမွာ Database ေရာက္လာၿပီ ဆိုရင္ေတာ့ အဲဒီ Database အတြက္ Entity Data Model တစ္ခု ေဆာက္ေပးဖို႔ လိုအပ္ပါတယ္။

Models Folder (right click) -> Add -> New Item …

Install template ထဲက Data ေအာက္ထဲမွာ ADO.NET Entity Data Model ကို ေရြးေပးရမွာ ျဖစ္ပါတယ္။

Model Contents ကို ေရြးတဲ့ေနရာမွာ Empty model နဲ႔ တစ္ခုျခင္း အေသးစိတ္ ျပန္လုပ္လို႔ ရေပမယ့္ အလြယ္ကူဆံုး နည္းလမ္းကေတာ့ Database ကေန generate လုပ္ခိုင္းတဲ့ နည္းလမ္းပါပဲ။ Generate from Database ကို ေရြးေပးပါ။ App_Data ထဲမွာရွိတဲ့ NORTHNWD database ကို သူ႔အလိုအေလွ်ာက္ ေရြးေပးပါလိမ့္မယ္။ ေနာက္ တစ္ဆင့္ကေတာ့ Model ထဲမွာ database ထဲက ဘယ္ table ကို ထည့္မလဲ ဆိုတာကို ေရြးခ်ယ္ ေပးရမွာပါ။ အခု ဥပမာ မွာေတာ့ NORTHNWD Database ထဲက Table အားလံုးကို အသံုးျပဳမွာ မဟုတ္ပဲ Products Table တစ္ခုကိုပဲ အသံုးျပဳမွာ ျဖစ္တဲ့အတြက္ Products ကိုပဲ ေရြးခ်ယ္ဖို႔ လိုအပ္ပါတယ္။ ေရြးခ်ယ္ျပီးရင္ေတာ့ Finish ကိုနွိပ္ေပးပါ။ ျပီးရင္ေတာ့ ပံုမွာ ျမင္ရတဲ့ အတိုင္း Product တစ္ခုထဲ ပါတဲ့ Entity Data Model တစ္ခုကို ေတြ႔ရမွာပါ။

ေနာက္တဆင့္ အေနနဲ႔ HomeController တစ္ခုကို ယူပါမယ္။ Controller name ကိုေပးတဲ့ ေအာက္နားမွာ ရွိတဲ့ Add action methods for Create, Update, Delete and Details scenarios ကို check mark ေပးဖို႔ လိုအပ္ပါတယ္။

ကြ်န္ေတာ္တို႔ ေရြးခ်ယ္ခဲ့တဲ့အတိုင္း Index action,Details action,Edit action,Delete action,Create action ေတြကို generate လုပ္ေပး ပါလိမ့္မယ္။ Details action ကို အသံုးျပဳမွာ မဟုတ္တဲ့အတြက္ ဖ်က္ပစ္ပါမယ္။ Models ထဲမွာရွိတဲ့ Entity Model ကိုယူသံုးမွာျဖစ္တဲ့အတြက္ C# အသံုးျပဳသူေတြ အေနနဲ႔ HomeController.cs ဖိုင္ထဲမွာ ေအာက္က တစ္ေၾကာင္း ေရးဖို႔ လိုအပ္ျပီးေတာ့ VB အသံုးျပဳသူေတြ ကေတာ့ ေရးဖို႔ မလိုအပ္ပါဘူး။

using MvcApplication6.Models;

ေနာက္အဆင့္ အေနနဲ႔ HomeColtroller class ထဲမွာ NorthwndEntities ကို Object အျဖစ္ ေၾကာ္ျငာရပါမယ္။

C# Code

NORTHWNDEntities StoreDB = new NORTHWNDEntities();

VB Code

Dim StoreDB As New NORTHWNDEntities

ေအာက္က code ေတြက Index action ထဲမွာ ေရးရမွာပါ။

C# Code

  public ActionResult Index()
        {
            var pros = StoreDB.Products.ToList();
            return View(pros);
        }

VB Code

  Function Index() As ActionResult
            Dim pros = StoreDB.Products.ToList()
            Return View(pros)
  End Function

Controller ေတြရဲ႔ action ေတြနဲ႔ ViewModels ေတြ အလုပ္လုပ္ပံုကို အရင္တုန္းက ေရးျပီးသား ျဖစ္တဲ့အတြက္ အေသးစိတ္ ျပန္ဖတ္ၾကည့္လို႔ ရပါတယ္။ ဒီအဆင့္ထိ ျပီးရင္ေတာ့ Views ထဲမွာ Viewpage တစ္ခုယူေပးဖို႔ လိုအပ္ပါတယ္။ View အသစ္ မယူခင္မွာ project ကို Build လုပ္ေပးရပါအံုးမယ္။

View Folder (right click) -> Add -> Views ..

View Name ကို Index လို႔ေပးရမွာျဖစ္ျပီး။ Create a strongly-typed view ကို check mark ေပးျပီး view data class ထဲမွာေတာ့ MvcApplication6.Models.Product ကိုေရြးေပးရမွာပါ။ View content မွာ list ကိုေရြးေပးျပီး select master page check mark ကိုေတာ့ ျဖဳတ္ပစ္လိုက္ပါ။ Add ကို ႏွိပ္လိုက္တာနဲ႔ Html code ေတြ generate လုပ္ထားတဲ့ Index view page တစ္ခု ေပၚလာမွာျဖစ္ပါတယ္။ Index.aspx ထဲမွာ

  <%: Html.ActionLink("Details", "Details", new { id=item.ProductID })%> |

ကို မလိုအပ္တဲ့အတြက္ ဖ်က္ပစ္လိုက္ပါ။

project ကို run ၾကည့္လိုက္တာနဲ႔ web browser ေပၚမွာ NORTHWND data base ထဲက Products table ထဲမွာ ရွိတဲ့ data ေတြကို အကုန္ တန္းစီျပီး ျမင္ရမွာပါ။

Http method မွာ Get နဲ႔ post ဆိုျပီး ၂ မ်ိဳးရွိပါတယ္။ page တစ္ခုကို ပထမဆံုး တစ္ၾကိမ္ ၀င္ေရာက္ျပီဆိုရင္ အဲဒါ Get က အလုပ္ လုပ္ပါတယ္။ အဲဒီ page ထဲက action တစ္ခုခုေၾကာင့္ အဲဒီ page ကိုပဲ redirect ျပန္လုပ္ရင္ Post က အလုပ္လုပ္ပါတယ္။ အခု Edit action မွာလည္းပဲ Get နဲ႔ Post ၂ ခုရွိပါတယ္။ ဆိုလိုတာက Index page မွာရွိတဲ့ Edit Link ကို ႏွိပ္လိုက္ရင္ Edit action ရဲ ႔ Get ကို အလုပ္လုပ္ျပီး Edit page ထဲက Save button(submit) ကို ႏွိပ္လုိက္ရင္ Edit action ရဲ႔ Post ကို အလုပ္လုပ္ပါလိမ့္မယ္။ ေအာက္က code ေတြက Edit action ရဲ႔ Get မွာ ေရးရမွာပါ။

C# Code

public ActionResult Edit(int id)
        {
            var pro = StoreDB.Products.Single(g => g.ProductID == id);
            return View(pro);
        }

VB Code

  Function Edit(ByVal id As Integer) As ActionResult
            Dim pro = StoreDB.Products.Single(Function(g) g.ProductID = id)
            Return View(pro)
        End Function

Edit action ရဲ႔ Get မွာ code ေတြေရးျပီးဆိုရင္ေတာ့ Edit action အတြက္ View တစ္ခု ေဆာက္ေပး ရပါအံုးမယ္။

View Name ကို Edit လို႔ေပးရမွာျဖစ္ျပီး။ Create a strongly-typed view ကို check mark ေပးျပီး view data class ထဲမွာေတာ့ MvcApplication6.Models.Product ကိုေရြးေပးရမွာပါ။ View content မွာ Edit ကိုေရြးေပးျပီး select master page check mark ကိုေတာ့ ျဖဳတ္ပစ္လိုက္ပါ။ Add ကို ႏွိပ္လိုက္တာနဲ႔ Html code ေတြ generate လုပ္ထားတဲ့ Edit view page တစ္ခု ေပၚလာမွာျဖစ္ပါတယ္။ Project ကို run ၾကည့္ျပီး Index page ထဲက Edit ကို နွိပ္လိုက္ရင္ ပံုမွာျမင္ရတဲ့အတိုင္း က်လာမွာပါ။ ျပင္ခ်င္တာျပင္ျပီးရင္ Save(submit) ကို ႏွိပ္လိုက္ရင္ ဘာမွ ျဖစ္လာေသးမွာ မဟုတ္ပါဘူး။ ဘာျဖစ္လို႔လည္းဆိုေတာ့ Edit action ရဲ႔ Post မွာ Edit အတြက္ ဘာ coding မွ မေရးရေသးလို႔ပါ။ ေအာက္က code ေတြက Edi action ရဲ႔ Post မွာ ေရးရမွာပါ။

C# Code

  [HttpPost]
        public ActionResult Edit(int id, FormCollection collection)
        {
            try
            {
                // TODO: Add update logic here
                var pro = StoreDB.Products.Single(g => g.ProductID == id);
                UpdateModel(pro);
                StoreDB.SaveChanges();
                return RedirectToAction("Index");
            }
            catch
            {
                return View();
            }
        }

VB Code

<HttpPost> _
        Function Edit(ByVal id As Integer, ByVal collection As FormCollection) As ActionResult
            Try
                ' TODO: Add update logic here
                Dim pro = StoreDB.Products.Single(Function(g) g.ProductID = id)
                UpdateModel(pro)
                StoreDB.SaveChanges()
                Return RedirectToAction("Index")
            Catch
                Return View()
            End Try
        End Function

Var pro=StoreDB.Products.Single(g=> g.ProductID=id);

Dim pro=StoreDB.Products.Single(Function(g) g.ProductID=id)

အဲဒီတစ္ေၾကာင္းက ကိုယ္ Edit ႏွိပ္လိုက္တဲ့ ProductID ကိုပဲ select လုပ္မယ့္သေဘာပါ။ Lambda expression နဲ႔ ေရးထားတာျဖစ္ပါတယ္။ (Lambda expression အေၾကာင္းကို သပ္သပ္ေရးပါအံဳးမယ္။)

Create မွာလည္း Get နဲ႔ Post ရွိပါတယ္။ ေအာက္က code ေတြက Create action ရဲ႔ Get မွာေရးရမွာပါ။

C# Code

   public ActionResult Create()
        {
            Product pro = new Product();
            return View(pro);
        }

VB Code

Function Create() As ActionResult
Dim pro = New Product()
Return View(pro)
End Function

တခါတည္း Create ရဲ႔ Post မွာပါ coding ေတြေရးလိုက္ရေအာင္။ ပါလာတဲ့ parameter အစား product ကိုေရးေပးရမွာပါ။

C# Code

[HttpPost]
        public ActionResult Create(Product pro)
        {
            try
            {
                // TODO: Add insert logic here
                StoreDB.AddToProducts(pro);
                StoreDB.SaveChanges();
                return RedirectToAction("Index");
            }
            catch
            {
                return View();
            }
        }

VB Code

<HttpPost()> _
        Function Create(ByVal pro As Product) As ActionResult
            Try
                ' TODO: Add insert logic here
                StoreDB.AddToProducts(pro)
                StoreDB.SaveChanges()
                Return RedirectToAction("Index")
            Catch
                Return View()
            End Try
        End Function

Create action ေရးျပီးသြားရင္ေတာ့ Create အတြက္ View တစ္ခု ေဆာက္ေပးရပါဦးမယ္။ View Name ကို Create လို႔ေပးရမွာျဖစ္ျပီး။ Create a strongly-typed view ကို check mark ေပးျပီး view data class ထဲမွာေတာ့ MvcApplication6.Models.Product ကိုေရြးေပးရမွာပါ။ View content မွာ Create ကိုေရြးေပးျပီး select master page check mark ကိုေတာ့ ျဖဳတ္ပစ္လိုက္ပါ။

Project ကို run ျပီး index page ရဲ႔ ေအာက္ေျခနားမွာ ရွိတဲ့ Create New ဆိုတဲ့ link ကို ႏွိပ္ျပီးေတာ့ Create page ထဲကို ၀င္ေရာက္ႏိုင္ပါတယ္။ product အသစ္အတြက္ ေဒတာ ေတြ ျဖည့္ျပီးရင္ေတာ့ Save ကို ႏွိပ္လိုက္ရင္ index page ကို ျပန္ေရာက္သြားျပီး အသစ္ထည့္ထားတဲ့ ေဒတာကို ေတြ႔ရမွာပါ။

Delete action မွာလည္း Get နဲ႔ Post ရွိပါတယ္။ Get မွာက Delete လုပ္ဖို႔အတြက္ comfirm လုပ္ခိုင္းမွာျဖစ္ျပီး။ post မွာက အမွန္တကယ္ ဖ်က္ပစ္မွာပါ။ ေအာက္က code ေတြက Delete Get action မွာေရးရမွာပါ။

C# Code

   public ActionResult Delete(int id)
        {
            var pro = StoreDB.Products.Single(g => g.ProductID == id);
            return View(pro);
        }

VB Code

        Function Delete(ByVal id As Integer) As ActionResult
            Dim pro = StoreDB.Products.Single(Function(g) g.ProductID = id)
            Return View(pro)
        End Function

ေအာက္က Code က Delete Post မွာ ေရးရမွာပါ။

C# Code

        [HttpPost]
        public ActionResult Delete(int id, FormCollection collection)
        {
            try
            {
                // TODO: Add delete logic here
                var pro = StoreDB.Products.Single(g => g.ProductID == id);
                StoreDB.DeleteObject(pro);
                StoreDB.SaveChanges();
                return RedirectToAction("Index");
            }
            catch
            {
                return View();
            }
        }

VB Code

<HttpPost> _
        Function Delete(ByVal id As Integer, ByVal collection As FormCollection) As ActionResult
            Try
                ' TODO: Add delete logic here
                Dim pro = StoreDB.Products.Single(Function(g) g.ProductID = id)
                StoreDB.DeleteObject(pro)
                StoreDB.SaveChanges()
                Return RedirectToAction("Index")
            Catch
                Return View()
            End Try
        End Function

Delete အတြက္ View တစ္ခု တည္ေဆာက္ ေပးရပါအံုးမယ္။ View Name ကို Delete လို႔ေပးရမွာျဖစ္ျပီး။ Create a strongly-typed view ကို check mark ေပးျပီး view data class ထဲမွာေတာ့ MvcApplication6.Models.Product ကိုေရြးေပးရမွာပါ။ View content မွာ Delete ကိုေရြးေပးျပီး select master page check mark ကိုေတာ့ ျဖဳတ္ပစ္လိုက္ပါ။

Asp.net MVC ကို အသံုးျပဳျပီးေတာ့ sql database နဲ႔ တြဲဖက္ျပီး data ေတြကို Create,Edit,Delete အလြယ္တကူ လုပ္လို႔ရပါတယ္။ တကယ့္လက္ေတြ႔မွာေတာ့ project နည္းနည္းၾကီးလာရင္ Create, Edit, Delete ေတြအတြက္ repository class ေတြ ေဆာက္ျပီး ေရးၾကတာမ်ားပါတယ္။

3 Responses

1. Thu Zar says:

   October 6, 2010 at 4:58 PM

   Edit နဲ့ Delete Aspx view မှာပြင်ရတာရှိသေးလားမသိဘူး။Run တာError တတ်လို့ပါ။ Createလည်းဘာပြင်ရသေးလဲမသိဘူး။ အဲဒါလည်းSaveမဖြစ်လို့ပါ။ကူညီပါအုံးနော်။

   Reply
2. Anonymous says:

   May 27, 2011 at 3:51 PM

   Correct!!! Thu Zar Post, I also cannot run the program Edit and Delete view…..

   Reply
3. Name says:

   July 13, 2011 at 2:57 PM

   SQL server 2005 ကို install လုပလြို.မရဘူးဖှစနြတယြေ

   Reply