Bài 01: Làm quen với ASP.NET MVC.

Xin chào các bạn hôm nay mình xin phép giới thiệu với các bạn một "option" mới của những người làm web. Đó là Framework ASP.NET MVC - Nó cũng có cả năm nay rồi hiện tại nó đang là Beta.

Tất cả các bài viết của mình đều lấy từ http://www.asp.net/learn/mvc/

OK! Băt đầu thôi.

Chuẩn bị:
* .NET 3.5
* OS của Microsoft (Vista, XP, Window2003, Window2008)
* VS 2008 (Sorry nhé minh không có test trên 2005)
* Download ASP.NET MVC từ http://www.asp.net/mvc/

chú ý: Minh chưa nói đến việc dùng MVC với IIS nhé. Trong bài này bạn đứng sợ một số code mà minh không hiểu ý nghĩa nhé sau này chúng ta sẽ "làm thịt nó".

Xong rồi bây gời tạo một cái Projects và đặt tên nó là gi tùy thích mình đặt tên theo nguyên gốc là "TaskList"



Bạn không cần phải tao Project test làm gì cái này thuộc về một lĩnh vực khác không cần quan tâm bây giờ



Tạo Controller.

Điển hình trong ASP.NET MVC là bạn sẽ băt đầu xây dựng một Controller khi xây dựng một ứng dụng. Bằng cách chọn phải chuột vào "Controllers folder" chọn Add, New Item -> MVC Controller Class.

Có thể nói Controller là nơi chưa những logic của ứng dụng. Nhưng chúng ta không quan tâm đến việc này vội chúng ta sẽ thay đổi Controller "HomeController.cs". Thêm vào các function Create(), CreateNew(), Complete()

* Create() - Được gọi khi bạn muốn hiển thị form để add thêm một task.
* CreateNew() - Được gọi khi một task thực sự được add vào database.
* Complete() - Được gọi khi hoàn thành việc add task.

public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}

public ActionResult About()
{
return View();
}

public ActionResult Create()
{
return View();
}

public ActionResult CreateNew()
{
return RedirectToAction("Index");
}

public ActionResult Complete()
{
return RedirectToAction("Index");
}
}
Chúng ta thấy rằng controller return một ActionResult, ActionResult là một mô tả mà action đo sẽ thực hiện.
Ở đây controller hoạt động như sau : khi user request Create() controller, một view chứa một form cho việc tạo task sẽ được return. Khi bạn submit form này, CreateNew() controller được gọi. CreateNew() add một task vào database và redirects user tới Index() controller. Index() controller return một view mà hiển thị toạn bộ các task. Cuối cùng nếu bạn chọn một task là "completed", thì Completed() controler sẽ cập nhật vào database. Complete() controller redirect user về Index() controller và cập nhật lại list task.

Tạo Views

Một View chưa HTML và nội dung để trả về cho Browser. Nếu bạn nào đã làm quen với ASP.NET thì trong ASP.NET MVC, View chính là các file *.aspx

Và điều quan trong là bạn phải đặt các View ở đúng vị trí của nó. Ví dụ: bạn tạo một view cho Index() của HomeController thì bạn phải đặt file đó theo đường dẫn sau "\Views\Home\Index.aspx"

Bạn có thể làm việc này bằng cách nhấp phải chuột lên folder Home rồi chọn Add, New Item. Rồi chọn "MVC View Page".

Sau khi tạo View chung ta có hình sau:

Đừng qua tâm đến phần About.aspx
Chỉ quan tâm đến Create.aspx và Index.aspx

















Index.aspx
Mở file này ra

Bạn cứ điền vào nội dung như vậy còn những cái có sẵn của nó có thể bỏ đi.
Hiện tại thì trong file này chưa hề có bất cứ đoạn code nào để thể hiện list Task. Nhưng có một link "Add New Task", khi bạn click lên link này thì Create() action của HomeController sẽ được gọi. Create() sẽ return lại một Create view. Bây gời ta sẽ quan tâm đến file Create.aspx, file này có code như hình dưới



Xin nhắc lại là trong MVC thì View chỉ có HTML và các file script cần thiết. Trong đoạn code trên ta thấy có 1 form với action="/Home/CreateNew", điều đó có nghĩa là khi bạn submit form này thì nó sẽ gọi CreateNew() action trong Home controller.

Tạo Database
Database trong ví dụ này rất đơn giản bạn chỉ cần tạo một bảng trong csdl như hình:



Mục database này mình sẽ không nói gì nhiều, mình chỉ muốn nói là mình sẽ dùng LINQ để kết nối database vì một lý do căn bản là "làm biếng" là thê này thao tác với database cho lẹ. Mình cũng nghĩ là nếu chúng đã xác định dùng MSSQL thì lên dùng LINQ to SQL - nhiều người nghĩ là perform của nó slow, nhưng đừng no về vụ này vì có cách để giải quyết rồi hi hi.

Tạo Models
Trong MVC, model không chưa bất kỳ view hoặc controller nào vậy nó chứa cái gì? Xin thưa là nó chứa tất cả những logic của ứng dụng để là việc với database. Trong ví dụ này các bạn sẽ không thấy được điều này vì mình chỉ để file LINQ to SQL trong này mà thôi, còn phần logic mình để nó trong Controller rồi --> làm biếng mà hi hi.
Các bạn tạo một file LINQ to SQL như hình - mình tạo bảng này trong database Northwind



Vậy là xong phần Models

Tạo Database logic trong Controller

Sai rồi "pa" seo để chỗ này ? Dạ em làm biếng lên tạo đây cho lẹ. Khi nào có điều kiện em sẽ làm cái khác đúng quy cách.

Mở file HomeController ra:

[HandleError]
public class HomeController : Controller
{
//Khai báo một đối tượng LINQ
private NorthwindDataContext db = new NorthwindDataContext();

//Action này sẽ trả về một list các Task tư database
public ActionResult Index()
{
var listTask = db.TaskTables.OrderByDescending(q => q.EntryDate);
return View(listTask.ToList());
}

//Chỗ này chúng ta tạm thời bỏ qua
public ActionResult About()
{
ViewData["Title"] = "About Page";
return View();
}

//Action này sẽ return lại một form cho phép bạn input một task mới.
public ActionResult Create()
{
return View();
}

//Action này sẽ được gọi khi một task mới được add vào database
public ActionResult CreateNew(string txtName)
{
TaskTable item = new TaskTable();

item.EntryDate = DateTime.Now;
item.Task = txtName;
item.IsCompleted = false;

db.TaskTables.InsertOnSubmit(item);
db.SubmitChanges();

//Sau khi đã cập nhật vào database chúng ta cần refress lại list các Task.
return RedirectToAction("Index");
}

//Action này được gọi khi bạn complete một task.
public ActionResult Complete(int id)
{
var taskList = db.TaskTables.Where(q => q.ID == id);

foreach(TaskTable item in taskList)
{
item.IsCompleted = true;
}

db.SubmitChanges();

//Sau khi đã cập nhật vào database chúng ta cần refress lại list các Task.
return RedirectToAction("Index");
}
}

Chú ý: Trong những action trên ta thấy CreateNew có một parameter string "txtName". Parameter này được ASP.NET MVC pass tự động từ form Create vào Controller.

Và công việc cuối cùng của chúng ta là modify Index View.



Bạn khai báo như hình trên. Và khi chạy ứng dúng sẽ như sau.

Index View :



Create View:



Tôi biết là nhiều bạn sẽ có rất nhiều câu hỏi về ASP.NET MVC. Các bạn yên tâm đi vì những thắc mắc của các bạn sẽ được giải thích ở nhữ bài viết sau. Mục đích của bài viết này chỉ là để cho các bạn thấy là ASP.NET MVC nó là cài gì thôi và các bạn cũng có thể triển khài n như thế nào.

Phải nói thật một câu là những bạn nào chỉ quen làm việc với ASP.NET truyên thống thì sẽ cảm thấy cái này kỳ quặc và khó hiểu. Nên Microsoft nói là ASP.NET MVC chỉ là một "option" cho ASP.NET thôi. Nếu ai không thích MVC thì có thể làm theo MVP, không băt buộc ai và có nhiều cách để thể hiện một vấn đề thôi.

See you!

Comments

Popular posts from this blog

How to search and HighLight !

What's ViewState? How does use?