2陆、ASP.NET MVC入门到精通——后台管理区域及分离、Js压缩、css、jquery扩大

本连串目录:ASP.NET
MVC4入门到明白类别目录汇总

有好一段时间没更新博文了,近期在忙两件事:1、看书,学习中…2、为同盟社年会节目做准备,由于时期久远尚无练习双截棍了,难免生分,所以今后一时抱佛脚。深圳近年来的天气有失水准,许五人胃痛了,笔者也改成当中之1,大家小心肢体…

那1篇,笔者来一句话来说一下接下去项目中会用到的部分乱7八糟的技能。

区域及分离

一5、ASP.NET MVC入门到精通——MVC-路由中,小编1度简要表明了区域的离别。

1、右键单击Web项目,“添加”——“区域”,区域名,大家那边命名叫Admin,创造完毕之后Web项目中,就会多出1个Areas文件夹,Areas文件夹下边会有三个大家刚刚创造的Admin文件夹,在Admin文件夹里面有完整的MVC项目标目录,这里,大家不想把控制器放在Web项目中,所以删除Controllers和Models文件夹。

二、新建类库项目Web.Logic.Admin,这么些类库项目我们来作为后台系统的区域,把Admin文件夹中的AdminAreaRegistration.cs拷贝出来,然后把那几个文件防到Web.Logic.Admin项目中,修改该文件的命名空间。

3、给Web.Logic.Admin项目增进如下引用

 图片 1

4、web项目添加Web.Logic.Admin项指标引用

五、Web.Logic.Admin项目中新建MemberController类

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

6、web项目中,在Areas/Admin/Views/Member目录下,添加视图Index.cshtml

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
测试

七、在浏览器输入地方http://localhost:10757/Admin/Member/,运行结果如下:

图片 2

 js压缩和合并

 Web项目中,BundleConfig.cs文件RegisterBundles方法中,添加如下代码:

            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;

那在那之中的jquery.msgProcess.js是自家自定义的。

View调用代码:

    @Scripts.Render("~/mvcAjax")

至于压缩和联合小编在二一、ASP.NET MVC入门到驾驭——ASP.NET
MVC四优化
那1篇中有更详实的验证,那里只是简短谈起,不再赘述。

Css

本身发觉许多.NET
Web开发职员前端那块相当薄弱,就算说过多商厦有专门的前端工程师和美术,不过通晓要求的前端知识照旧大有裨益的。

读书CSS,作者推荐一本电子书《CSS禅意花园》,我们不须求对Css掌握很深,能做到看懂大多数CSS代码,拷贝一些现成的Css样式时,本人会修改其作风就足以了。

此间自个儿差不多说一下咱们开发中用得十三分频仍的Css样式。

大家平时会遇上这么的须要,依据条件,动态控制界面中某1成分的隐形和显示,大家经常会思量如下三种方法完成:

安装成分隐藏

  • display:none;
  • visibility:hidden;

display:不会影响Css布局,display实际上是设置成分的变迁特征。

visibility:会潜移默化Css布局,从性质上的话,会促成一定的震慑,因为它会造成Html界面重排。设置为hidden时,成分固然被埋伏了,但它照旧占有它原先所在的地点,visibility属性是隐藏成分但保持成分的更动地方。

Jquery

Jquery,也是大家Web项目支出中不时会接纳到的,推荐一本电子书《锋利的Jquery》。

为了统一Ajax数据格局,我先在Model项目中添加2个联合的
Ajax格式类AjaxMsgModel

    /// <summary>
    /// 统一的 Ajax格式类
    /// </summary>
    public class AjaxMsgModel
    {
        public string Msg { get; set; }
        /// <summary>
        /// OK,ERROR
        /// </summary>
        public string Statu { get; set; }
        public string BackUrl { get; set; }
        /// <summary>
        /// 数据对象
        /// </summary>
        public object Data { get; set; }
    }

接下来在Web项指标Scripts目录中新建了五个js文件jquery.msgProcess.js,然后在里边添加了1个jquery增添方法,至于Jquery的恢弘方法应用,假设不明了,请直接查资料。作者常有是欣赏拿来注意,先Copy过来,然后斟酌懂,最终本身修改下,典型的懒人做法。

(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));

View中调用

    <script type="text/javascript">
        function Success(jsonData) {
            $.procAjaxData(jsonData, function () { window.location = jsonData.BackUrl; });
        }
    </script>

 Jquery EasyUI

至于EasyUI,我们站在1个使用者的角度来说,实在是更它的名字1样easy。关于它的采取能够去
http://www.jeasyui.net/学习。

选择2个版本,把源码和文书档案下载下来,最新的本子,文书档案一般为英文。下载下来后,里面有成都百货上千html的德姆o。有现成的就平素拷贝过来,网上有关easyUI的言传身教代码多如牛毛,依然那句话,拷贝过来,看得懂,会修改,就OK了,不提出在没上学1种新的框架前,把框架的文书档案从头学到尾,现实工作中,也很少有卖家会有那么多闲时间给到大家,所以大家1般是先用起来,有亟待,再深切。