ASP. NET MVC2 chapter I

Source: Internet
Author: User
Tags actionlink
§ 6 sportsstore: Administration and final enhancements

As the last part of sportsstore, your main task is to allow administrators to update their products. In this chapter, you will learn the following points:

    • How to allow users to edit a group of data (create, read, update, delete) and verify that each submission
    • How to Use Form Verification and filtering to ensure the security of the controller and action methods. If necessary, a logon prompt is displayed.
    • How to receive file uploads
    • How to display images stored in SQL database
§ 6. 1 adding Catalog Management

According to the common software practice, the data management method is to list and edit the data, so that users can conveniently add, delete, modify, and query data ,:

 

§ 6. 1.1 creating admincontroller: a place for the crud features

Let's startSportsstoreImplement a simple crud user interface and createAdmincontrollerController

Namespace sportsstore. webui. controllers {public class admincontroller: controller {private iproductsrepository productsrepository; Public admincontroller (incluproductsrepository) {This. productsrepository = productsrepository ;}}}

 

§ 6. 1.2 rendering a grid of products in the repository

In order to achieve the effect, we need to add an action method to list all products. According to the ASP. net mvc convention, we call it index.

 
Public actionresult index () {return view (productsrepository. Products. tolist ());}
Implementing the List View

Before adding a view to this action, create a master page for the management block. In the/views/shared folder, right-click to create the MVC 2 view master page, which is called Admin. master.

 
<% @ Master language = "C #" inherits = "system. Web. MVC. viewmasterpage" %> <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML xmlns = "http://www.w3.org/1999/xhtml"> 
Body, TD {font-family: segoe UI, verdana} H1 {padding :. 5em; padding-top: 0; font-weight: bold; font-size: 1.5em; border-bottom: 2px solid gray;} Div # Content {padding :. 9em;} table. grid TD, table. grid Th {border-bottom: 1px dotted gray; text-align: Left;} table. grid {border-collapse: collapse; width: 100%;} table. grid th. numericcol, table. grid TD. numericcol {text-align: Right; padding-Right: 1em;} Div. message {Background: Gray; color: White; padding :. 2em; margin-top :. 25em ;}. field-Validation-error {color: red; display: block ;}. field-Validation-valid {display: none ;}. input-Validation-error {border: 1px solid red; Background-color: # ffeeee ;}. validation-Summary-errors {font-weight: bold; color: red ;}. validation-Summary-valid {display: none ;}

 

Next, we should create the view. Note that when selecting the master page, we should select Admin. Master instead of the previous site. master.

Tip: When you select View content, vs sets the default viewdata class to ienumerable <the class you selected>, that is, you do not need to enter ienumerable <...>

After adding the file, we will find that there are many redundant files generated.Code, Let's clear it:

<% @ Page Language = "C #" masterpagefile = "~ /Views/shared/admin. master "inherits =" viewpage <ienumerable <sportsstore. domain. entities. product >>>" %> <asp: Content ID = "content1" contentplaceholderid = "titlecontent" runat = "server"> admin: All products </ASP: content> <asp: content ID = "content2" contentplaceholderid = "maincontent" runat = "server"> 
 

 

Run it now, and enter http: // localhost: Port/admin/index in the address bar.

 

§ 6. 1.3 building a product Editor

Next, we will do the "Create" and "Update" functions, so that we need to display a view and process the information submitted by the user. we will create a method to process the [get] request and the [Post] request respectively to process the information submitted by the form.

The Edit () method is to get the requested item and pass it to other views in the form of a model. We want to add the following method to admincontroller:

 
Public viewresult edit (INT productid) {var Product = productsrepository. Products. First (x => X. productid = productid); Return view (product );}

 

Creating a product editor UI

Now, we need to create a view for the edit activity.

This will generate a lot of useless code, and we will clean it up again.

<% @ Page title = "" Language = "C #" masterpagefile = "~ /Views/shared/admin. master "inherits =" system. web. MVC. viewpage <sportsstore. domain. entities. product> "%> <asp: Content ID =" content1 "contentplaceholderid =" titlecontent "runat =" server "> admin: Edit <% = model. name %> </ASP: content> <asp: Content ID = "content2" contentplaceholderid = "maincontent" runat = "server">  

 

Here, we use HTML. editorformodel () to automatically build the entire user interface.

When you access the product editing interface (/admin/index and click a product), the following interface appears:

This kind of interface is really not human-friendly. ID, which will not be changed obviously, and the space of description is too small. Next, we will make some modifications to product. CS:

 
Namespace sportsstore. domain. entities {[Table (name = "Products")] public class product {[hiddeninput (displayvalue = false)] [column (isprimarykey = true, isdbgenerated = true, autosync = autosync. oninsert)] public int productid {Get; set;} [column] public string name {Get; set;} [column] [datatype (datatype. multilinetext)] Public String description {Get; set;} [column] public decimal price {Get; set;} [column] Public String category {Get; Set ;}}}

 

Here, the hiddeninput is in system. Web. MVC. dll.ProgramSo add system. Web. MVC. dll reference.

Tip: If you really don't want to reference the system. Web. MVC. dll assembly, you can change [hiddeninput (displayvalue = false)] to [scaffoldcolumn (false)].

Of course, you can also modify the CSS file./content/adminstyles.css

 
. Editor-field {margin-bottom :. 8em ;}. editor-label {font-weight: bold ;}. editor-label: After {content :":"}. text-box {width: 25em ;}. multi-line {Height: 5em; font-family: segoe UI, verdana ;}

Next, run the program and you will see the following interface:

 

 

Handling edit submissions

 

Don't write these unnutritious things, and wait until you learn it well and continue ....

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.