ASP. net mvc 2: The first ASP. net mvc program, asp. netmvc
Abstract:
This article takes you step by step to create a simple ASP. net mvc program.
Create a new ASP. net mvc Project
Click "OK" to open the following window:
Select the "Empty" template and the "MVC" option. This time, no unit test is created, so "Add unit tests" is not selected ". Click "OK.
After the project is created, the default folder structure of the project is as follows:
Click Run to open the browser when the program is executed:
The execution result is a server error in the application, because we created an empty ASP. net mvc project with no controller or view.
Add the first Controller
Select the Controller folder, right-click, and select "Controller" in the pop-up menu ". Open the following dialog box:
Select "MVC Controller-Empty" and click "Add.
In the dialog box that appears later, change the Controller name to "HomeController" and add the empty Controller to the project.
The default Controller code is as follows:
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.Mvc;
6
7 namespace PartyInvites.Controllers
8 {
9 public class HomeController: Controller
10 {
11 // GET: Home
12 public ActionResult Index ()
13 {
14 return View ();
15}
16}
17}
Modify the Action Index and return the string:
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.Mvc;
6
7 namespace PartyInvites.Controllers
8 {
9 public class HomeController: Controller
10 {
11 // GET: Home
12 public string Index ()
13 {
14 return "Hello Word";
15}
16}
17}
Execute the program and get the running result in the browser:
Back to the web page
Continue to modify the Index method and use the View () function to return the result.
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.Mvc;
6
7 namespace PartyInvites.Controllers
8 {
9 public class HomeController: Controller
10 {
11 // GET: Home
12 public ViewResult Index ()
13 {
14 return View ();
15}
16}
17}
Execute the program and get the execution result in the browser.
This error is because we have not added a view to the controller Action.
Right-click inside the Index method and select the "Add View" button in the pop-up menu.
Click the "Add" button in the pop-up dialog box.
The default content of the created view is as follows:
1 @{
2 Layout = null;
3}
4
5 <! DOCTYPE html>
6
7 <html>
8 <head>
9 <meta name = "viewport" content = "width = device-width" />
10 <title> Index </ title>
11 </ head>
12 <body>
13 <div>
14 </ div>
15 </ body>
16 </ html>
Modify the content in <div> </ div>.
1 @{
2 Layout = null;
3}
4
5 <! DOCTYPE html>
6
7 <html>
8 <head>
9 <meta name = "viewport" content = "width = device-width" />
10 <title> Index </ title>
11 </ head>
12 <body>
13 <div>
14 Hello, World
15 </ div>
16 </ body>
17 </ html>
Execute the program and get the execution result in the browser.
At this time, the file Index.cshtml was added to the folder Views-> Home.
Add dynamic output
Return to Index method and output dynamic content.
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Web.Mvc;
6
7 namespace PartyInvites.Controllers
8 {
9 public class HomeController: Controller
10 {
11 // GET: Home
12 public ViewResult Index ()
13 {
14 int hour = System.DateTime.Now.Hour;
15 ViewBag.Greeting = hour <12? "Good Moring": "Good Afternoon";
16 return View ();
17}
18}
19}
Return to the Index view and present dynamic content.
1 @{
2 Layout = null;
3}
4
5 <! DOCTYPE html>
6
7 <html>
8 <head>
9 <meta name = "viewport" content = "width = device-width" />
10 <title> Index </ title>
11 </ head>
12 <body>
13 <div>
14 @ ViewBag.Greeting World (from the view)
15 </ div>
16 </ body>
17 </ html>
Execute the program and get the running result in the browser.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
