ASP. NET mvc3 practice-movie, a simple mvc3 Application

As the first application in this series, this article selects a Tutorial Project on ASP.net and "movie list" as an example, this series is intended for readers who have basic knowledge about Asp.net and MVC development. In addition to razor content, this series is a brief introduction.

1. Create a project

Select the WEB Project of C # and create an mvc3 project. 1. Use the second template, make sure that the view engine is razor, and check the HTML5 syntax label.

Figure 1.

After creating a project, as shown in project layout2, remember this layout, which is a typical mvc3 project layout.

Figure 2.

For those who have used MVC2, I believe that the _ viewstart and _ layout files are no stranger. For other details about the ASP. NET MVC framework, see:

Msdn: mvc3 reference on msdn. It is recommended to view it quickly.

Msdn: razor introduction. It is recommended that readers who have not used it learn more.

ASP. NET mvc3 practice -- getting started

2. Observe and modify homecontroller

Open homecontroller. CS and modify the viewbag. Message content, as shown in 3. Here we will first come into contact with razor, and it is a very powerful content, viewbag. This is a dynamic type. You can dynamically set an attribute with the get/set method. Simply put, you can add the desired information to viewbag, such as viewbag. lovemessage, viewbag. eureka and so on. Here we add an Eureka attribute to viewbag (do not ask me what Eureka is ...... Then, assign it "my movie list ".

Figure 3.

Note: here we use the homecontroller provided by the MVC template. we modified the preset viewbag of the template. message, because viewbag. message is applied in the view of the index. Therefore, we need to modify the reference in the view, as shown in 4. Here we can see that razor has a convenient function. The "@" symbol, the statements guided by "@", will be parsed into C # code by the razor engine, "@ {// code block}" supports code segments. As a web developer who writes curly braces, this is undoubtedly a very good improvement.

Figure 4.

Okay. Now let's compile the project and check out our first mvc3 application. Run it! 5.

Figure 5.

3. Create a controller and view it.

Careful readers may find that the about method is commented out in the previous homecontroller. Yes. Before starting this step, you need to comment out the about method in homecontroller and delete the about. cshtml in the home directory in the view. Right-click the Controller folder and choose add> controller to create a controller named about. The empty template is used here, we do not need it to do more.

Figure 6.

Then we will get an aboutcontroller class, as shown in 7. With the controller, we will naturally think of views (note that we do not need about to do more, so we do not need a model). To add a view, in Visual Studio, it is a simple task. Right-click the method and choose add view. Visual Studio generates a view for the corresponding method.

Figure 7.

We will slightly modify the display content in the generated view, as shown in figure 8.

Figure 8.

Once again, the Project template provided by Visual Studio is deleted from the about method and view in homecontroller, but the link of about has not been modified. Note, the template contains the about link in layout. We modify the actionname and Controller of the original actionlink as the index method of our aboutcontroller and the new controller name, about.

Figure 9.

Okay. The modification is complete. Let's take a look at our results.

Figure 10.

4. Use the code first of entityframework to create a model and create the controller and view for it.

Once again, this article is intended for readers who have basic ASP. NET knowledge. If you have experience with hibernate, you can also. Code first is not described in detail in this and subsequent articles, but there are a lot of examples. The so-called code first, as its name, first has code in other words, first writes the data entity class, then the database or something, entityframework will solve for us. Code first is a mode in entityframework. Others include schema first and model first.

First, add a class in the models folder named Movie, as shown in 11.

Figure 11.

TIPS: many users of Visual Studio are not familiar with the operation details of Visual Studio. For example, we want to create five attributes for moive. Before creating each attribute, you only need to type "prop" and then press the tab twice to generate a public attribute template.

Then, we create a context, the simplest code first, and our database is ready!

Figure 12.

After the data code is added, we only need to go to the Web. add connectionstring in config, and the data processing entityframwork in the background will be completed for US (I believe readers with hibernate development experience can easily understand this point)

It should be noted that connectionstring needs to set the name attribute to the previously created context attribute:

      <add name="MovieDbContext"           connectionString="data source=.\sqlexpress;integrated security=SSPI;database=Movie"           providerName="System.Data.SqlClient"/>

The model already exists, and the MVC is worse than V and C. Here we do not manually add V and C, but use the powerful automation function of Visual Studio. Right-click the controllers folder and add a controller, here, 13 is shown.

Template: controller with read/write/view Methods

Model class: Movie

Data context class: moviedbcontext

Make sure that the razor engine is used.

Figure 13.

Then click Add. Visual Studio will automatically create the controller and view of the movie model for us. The movies code is shown in the code segment. As you can see, Visual Studio automatically creates several other methods, and some of them have get and post versions.

using System;using System.Collections.Generic;using System.Data;using System.Data.Entity;using System.Linq;using System.Web;using System.Web.Mvc;using MvcMoive.Models;namespace MvcMoive.Controllers{     public class MoviesController : Controller    {        private MovieDbContext db = new MovieDbContext();        //        // GET: /Movies/        public ViewResult Index()        {            return View(db.Movies.ToList());        }        //        // GET: /Movies/Details/5        public ViewResult Details(int id)        {            Movie movie = db.Movies.Find(id);            return View(movie);        }        //        // GET: /Movies/Create        public ActionResult Create()        {            return View();        }         //        // POST: /Movies/Create        [HttpPost]        public ActionResult Create(Movie movie)        {            if (ModelState.IsValid)            {                db.Movies.Add(movie);                db.SaveChanges();                return RedirectToAction("Index");              }            return View(movie);        }                //        // GET: /Movies/Edit/5         public ActionResult Edit(int id)        {            Movie movie = db.Movies.Find(id);            return View(movie);        }        //        // POST: /Movies/Edit/5        [HttpPost]        public ActionResult Edit(Movie movie)        {            if (ModelState.IsValid)            {                db.Entry(movie).State = EntityState.Modified;                db.SaveChanges();                return RedirectToAction("Index");            }            return View(movie);        }        //        // GET: /Movies/Delete/5         public ActionResult Delete(int id)        {            Movie movie = db.Movies.Find(id);            return View(movie);        }        //        // POST: /Movies/Delete/5        [HttpPost, ActionName("Delete")]        public ActionResult DeleteConfirmed(int id)        {                        Movie movie = db.Movies.Find(id);            db.Movies.Remove(movie);            db.SaveChanges();            return RedirectToAction("Index");        }        protected override void Dispose(bool disposing)        {            db.Dispose();            base.Dispose(disposing);        }    }}

The MVC details are not described here. Next, let's take a look at the views that the system has created for us, as shown in figure 14,

Figure 14.

Here we will look at the content of one of the views.

Figure 15.

With regard to this Code, careful readers will find that it is so sharp that HTML and C # code can be seamlessly integrated! For more details, I will introduce them to you in subsequent articles.

Okay. Finally, let's take a look at our final results (here, I used create new to create two columns ).

Figure 16.

This is razor, and this is ASP. NET mvc3!

Download the Code involved in this article

To avoid compatibility issues, only modified files are provided here. To use the changed files, you only need to create a project following the steps described earlier in this article and overwrite the content in the package, the same applies to subsequent articles.