• .net网站开发(前端):4.MVC HtmlHelper


    通过前面三节,已经大概理解MVC是怎样运作的了。MVC的一个特点就是可以很方便地控制视图效果,数据交互也很灵活。先讲一下视图控制的,HtmlHelper,看到Help就知道它是不知疲惫的好人啦(有点像SQLHelper?)

    .net MVC自带的HtmlHelper自带一部分功能,但如果我们不自定义自己功能,它能实现的效果也就和<input>标签差不多吧。先看下自带的效果:

    一:创建一个HtmlHelper的控制器(名字为别的也行~)

    Index添加视图

    <body>
        <div>
        <%--链接文字--%>
        <%:Html.ActionLink("链接文字?","About","Home") %>    </br>
      <%:Html.ActionLink("红色的链接文字", "About", "Home",new { Style="color:red;"})%>    </br>
     //<%--(但此次的Url链接不知道为什么新增了几个字符)--%>
    //<a Style="color:red;" href="/HtmlHelper/About?Length=4">红色的链接文字</a>
      
        <%--文本框--%>
        <%:Html.TextBox("txtName","乡巴佬") %>     </br>  
        <%--单选控件(控件名相同表示为同一组)--%>
        男:<%:Html.RadioButton("txtGender",1,true) %>     </br>
        女:<%:Html.RadioButton("txtGender",2,false) %>     </br>
        <%--ComboBox(先到控制器发送一个数据到视图)--%>     </br>
        <%:Html.DropDownList("city")%>     </br>
        </div>
    </body>


     

    控制器代码:

    public ActionResult Index()
            {
                ViewData["city"] = new List<SelectListItem>()
                                    {
                new SelectListItem(){Selected=false,Text="揭阳",Value="2"},
                new SelectListItem(){Selected=false,Text="惠州",Value="2"}
                                    };
                return View();
            }


     

    二:为HtmlHelpert添加自己的方法

    (试想一下,如果你很多页面经常要使用一个功能,如表格数据展示,而且格式差不多,那就可以传入参数写到HtmlHelper类中去,这样子,前端使用的时候,只需要短短一行代码即可,而不需要再写table标签啊for循环啊)

    Model下新增一个类:MyHtmlHelper

    using System.Web.Mvc;
    //using System.Web.Mvc并将namespace该为System.Web.Mvc,这样前台使用时新创建的方法就不用再解析了。
    namespace System.Web.Mvc 
    {
        //修改为静态方法
        public static class MyHtmlHelper
        {
            //扩展方法(本质是静态方法),为this关键词的类新增另定义的方法。
            public static MvcHtmlString showMyLable(this HtmlHelper helper, string lbText)
            {
                //不要return string类型而是 return MvcHtmlString类型,因为前者会自动加上转义符传到前台。
                return MvcHtmlString.Create(string.Format("<span>{0}</span>", lbText));
      //也可以使用HtmlString
            }
        }
    }


     

    前台使用:

    <%:Html.showMyLable("自定义label") %>


     

  • 相关阅读:
    【Selenium】Option加载用户配置,Chrom命令行参数
    Webdriver中关于driver.navigate().to()和driver.get()使用的区别
    【Selenium】idea导入eclisp项目的问题
    【数据库】数据库操作
    【monkey】
    【idea】idea快捷键
    【Selenium】Selenium1
    【Selenium】idea的selenium环境配置
    前端学习
    CSS 居中
  • 原文地址:https://www.cnblogs.com/pangblog/p/3275783.html
Copyright © 2020-2023  润新知