26. ASP. net mvc beginners-background management areas and separation, Js compression, css, jquery extension, mvcjquery

26. ASP. net mvc beginners-background management areas and separation, Js compression, css, jquery extension, mvcjquery

This series of directories: ASP. NET MVC4 entry to the master series directory Summary

I haven't updated my blog for a while. I have been busy with two things recently: 1. reading books and learning... 2. Preparing for the Annual Meeting Program of the company. Because I haven't practiced the dual-stick for a long time, it is inevitable that I am unfamiliar with it, so now I am holding my feet temporarily. The recent weather in Shenzhen is abnormal. Many people have caught a cold and I have become one of them. Please pay attention to your health...

In this article, I will briefly introduce some of the technologies that will be used in the next project.

Regions and separation

15. ASP. net mvc entry to master-MVC-routing, I have briefly explained the separation of regions.

1. Right-click the Web Project, click "add" -- "region", and name the region as Admin. After the project is created, an Areas folder is displayed, the Areas folder contains the Admin folder we just created. The Admin folder contains the complete directory of the MVC project. Here, we do not want to place the controller in the Web project, delete the Controllers and Models folders.

2. Create a class library project Web. logic. admin: This class library project is used as the background system area. copy the file from cs and prevent the file from accessing the Web. logic. in the Admin project, modify the namespace of the file.

3. Add the following reference to the Web. Logic. Admin project:

 

4. Add a reference for the web. Logic. Admin project to the Web project.

5. Create a MemberController class in the Web. Logic. Admin project.

    public class MemberController : Controller    {        [HttpGet]        public ActionResult Index()        {            return View();        }    }

6. In a web project, add View Index. cshtml under the Areas/Admin/Views/Member directory

@ {ViewBag. Title = "Index" ;}< h2> Index 
7. Enter the address http: // localhost: 10757/Admin/Member/in the browser. The running result is as follows:
Js compression and merge
In the Web Project, add the following code to the BundleConfig. cs file RegisterBundles method:
            bundles.Add(new ScriptBundle("~/mvcAjax").Include("~/Scripts/jquery-1.8.2.min.js", "~/Scripts/jquery.unobtrusive-ajax.min.js", 
"~/Scripts/jquery.validate.min.js", "~/Scripts/jquery.validate.unobtrusive.min.js", "~/Scripts/jquery.msgProcess.js"));            BundleTable.EnableOptimizations = true;
Here jquery. msgProcess. js is custom.
View call code:
    @Scripts.Render("~/mvcAjax")
For more details about compression and merge, I am getting started with ASP. NET MVC -- ASP. NET MVC4 optimization.
Css
I found that the front-end of many. NET Web developers is very weak. Although many companies have specialized front-end engineers and engineers, It is very helpful to master the necessary front-end knowledge.
To learn about CSS, I recommend an e-book "CSS zen garden". We do not want to know Css deeply. We can understand most of the CSS code and copy some ready-made Css styles, you can modify the style.
Here I will briefly describe the Css styles that are frequently used in our development.
We often encounter this requirement. Based on the conditions, we dynamically control the hiding and display of an element in the interface. We usually consider the following two methods:
Set element hiding

 

 
  
Display: none;
 
  
Visibility: hidden;

 
Display: does not affect the Css layout. display is actually a floating feature of setting elements.
Visibility: it will affect the Css layout. In terms of performance, it will have a certain impact, because it will lead to Html interface rearrangement. When it is set to hidden, although the element is hidden, it still occupies its original position. The visibility attribute is a hidden element but keeps the element floating position.
Jquery
Jquery, which is often used in Web project development, is recommended as an e-book "sharp Jquery".
To unify the Ajax data method, I first add a unified Ajax format class AjaxMsgModel to the Model project.
/// <Summary> // unified Ajax format class // </summary> public class AjaxMsgModel {public string Msg {get; set ;} /// <summary> // OK, ERROR // </summary> public string Statu {get; set;} public string BackUrl {get; set ;} /// <summary> // Data object // </summary> public object Data {get; set ;}}
Then, create a js file jquery In the Scripts directory of the Web project. msgProcess. js, and then added a jquery Extension Method in it. For Jquery Extension Method usage, if you are not clear about it, check the information directly. I always like to pay attention to it. I Copy it first, then I understand it, and finally I modify it myself. This is a typical lazy practice.
(function ($) {    $.extend($, {        procAjaxData: function (data,funcSuc,funcErr) {            if (!data.Statu) {                return;            }            switch (data.Statu)            {                case "OK":                    alert("OK:" + data.Msg);                    if (funcSuc) funcSuc(data);                    break;                case "ERROR":                    alert("ERROR:" + data.Msg);                    if (funcErr) funcErr(data);                    break;            }        }    });}(jQuery));
Call in View
    <script type="text/javascript">        function Success(jsonData) {            $.procAjaxData(jsonData, function () { window.location = jsonData.BackUrl; });        }    </script>
Jquery EasyUI
As for EasyUI, it is actually easier to get the same name as a user. For more information, see http://www.jeasyui.net.
Select a version and download the source code and documentation. The latest version is generally in English. After the download, there are many html demos. If there is a ready-made file, copy it directly. There are countless examples of code on easyUI on the Internet. If you just copy it, you can understand it, modify it, and you will be OK, we do not recommend that you take the framework documents from the beginning to the end before learning a new framework. In actual work, few companies will spend so much time on us, therefore, we generally use it first. If necessary, we need to go deeper.