当前位置: 代码迷 >> HTML/CSS >> asp.net mvc3 HtmlHelpers  Extension 跟  Razor Declarative 用法
  详细解决方案

asp.net mvc3 HtmlHelpers  Extension 跟  Razor Declarative 用法

热度:989   发布时间:2013-03-27 11:22:42.0
asp.net mvc3 HtmlHelpers  Extension 和  Razor Declarative 用法

1. Razor Helpers 的运用:
例如,定义好 ViewBag.Message = "Welcome to ASP.NET MVC!";我要在界面上显示
"Welcome ..."; 那我们一般有2种操作,3种实现操作:

2种操作:

Extension Method off HtmlHelpers 和 Razor Declarative @Helper Sytnax

3种实现方式:
一、 Extension  Method
在当前项目下建立一个文件夹,命名为Helpers,在这个文件夹下添加 HtmlHelpers类,具体实现如下


namespace MVCET.Helpers
{
    public static class HtmlHelpers
    {
        public static string Truncat(this HtmlHelper helper, string input, int length)
        {
            if (input.Length <= length)
            {
                return input;
            }
            else
            {
                return input.Substring(0, length) + "...";
            }
        }
    }
}

这时候,在页面上只要添加这样的代码就可以显示了:
@using MVCET.Helpers
<h2>@Html.Truncat(@ViewBag.Message as string,8)</h2> http://www.52mvc.com

二、 Razor Declarative @Helper Sytnax
1. 在当前页面添加如下代码:
@helper Truncat(string input, int length)
{
    if(input.Length<=length)
    {
        @input
    }
    else
    {
        @input.Substring(0,length)<text>...(Razor)</text>
    }
}
再添加这行代码:
<h2>@Truncat(@ViewBag.Message as string, 8)</h2>

显示的结果和上面的事一模一样的。

2. 添加App_Code 文件夹,然后添加RazorHelper.cshtml  Razor 文件。声明如下: 


@helper Truncat(string input, int length)
{
    if(input.Length<=length)
    {
        @input
    }
    else
    {
        @input.Substring(0,length)<text>...(Razor)</text>
    }
}

 在页面上添加以下代码:
<h2>@RazorHelper.Truncat(@ViewBag.Message,8)</h2>
运行,我们看到结果是一样的。

-----------------------------

2.运用Linq进行带参查询
如果说,在Index 页面中添加了参数,那么我们就可以有很多种方式给其传参,让其响应事件。 例如,在下面的例子中,可以有一个快捷方式去查看Shanghai 的Restaurant.

第一种:通过@Html.ActionLink()

在RestaurantControl 中添加以下代码


OdeToFoodDB _db = new OdeToFoodDB();
public ActionResult Index(string city)
 {
            var model = from r in _db.Restaurants
            where r.Adress.City == city ||(city==null)
            orderby r.Name
            select r;
            return View(model);
}

在Restaurant的View 中,Index页面写入一下代码:
<p>@Html.ActionLink("To see Restaurant in shanghai","Index","Restaurant",new {city="Shanghai"},null)</p>

第二种:绑定字段

添加DownloadList列表,让其通过选项进行自由选择。DownloadList可以绑定字段。
在RestaurantControl 中添加以下代码:


OdeToFoodDB _db = new OdeToFoodDB();
        public ActionResult Index(string city)
        {
            ViewBag.City = _db.Restaurants.Select(r => r.Adress.City).Distinct();
            var model = from r in _db.Restaurants
                        where r.Adress.City == city ||(city==null)
                        orderby r.Name
                        select r;
            //var model = _db.Restaurants
            
//    .Where(r => r.Adress.City == "Guangdong")
            
//    .OrderBy(r => r.Name);
            return View(model);
        }

在Restaurant的View 中,Index页面写入一下代码:
@using (Html.BeginForm("Index","Restaurant",FormMethod.Get))
{
@Html.DropDownList("City",new SelectList(ViewBag.City))
    <input type="submit" value="Filter" />
}

在这里,我让DropDownList 绑定了一个dynamic 类型(ViewBag.City)的数据。


更多asp.net mvc3  http://www.52mvc.com/topictag-191.aspx

  相关解决方案