MVC Html助手或部分视图到可重用按钮

时间:2016-03-04 08:02:17

标签: asp.net-mvc twitter-bootstrap html-helper

我有一个使用bootstrap类设计的按钮类型,我希望这样做可以重复使用。

我的编辑按钮

        <a href="@Url.Action("Edit", new {id = item.Id})" class="btn btn-warning btn-sm">
            <i class="glyphicon glyphicon-pencil"></i>
        </a>

我的删除按钮

        <a href="@Url.Action("Delete", new {id = item.Id})" class="btn btn-danger btn-sm">
           <i class="glyphicon glyphicon-trash"></i>
       </a>

如何将此格式设置为可重复使用。有部分或HtmlHelpers?有样品吗?

1 个答案:

答案 0 :(得分:0)

正如@ Stephen建议您可以同时使用这两个,您可以使用以下代码创建HTML Helpers

namespace System.Web.Mvc
{

public static class CustomHtmlHelpers
{

    public static MvcHtmlString BootStarpDeleteHelper(this HtmlHelper htmlHelper, string action)
    {
        StringBuilder sb = new StringBuilder();  
        sb.Append("<a href=" + action + " class='btn btn-danger btn-sm'>");
        sb.Append("<i class='glyphicon glyphicon-trash'></i>");
        sb.Append("</a>");
        return MvcHtmlString.Create(sb.ToString());  
    }

}

}

在主视图中,您可以像这样调用html帮助器

@Html.BootStarpDeleteHelper("#");

否则,您还可以在共享文件夹中创建局部视图,并创建名为_BootStarpDelete

的新局部视图

视图看起来像这样

@{
  Layout = null;
}
<a href="@Url.Action("Delete", new {id = item.Id})" class="btn btn-danger btn-sm">
   <i class="glyphicon glyphicon-trash"></i>
</a>

在主视图中,您可以像这样渲染

@Html.RenderPartial("_BootStarpDelete")

希望上面的解释对您有所帮助。如果您想要html helperedit都有一个delete,则需要传递classes作为参数。如果相同则如果您要partial view方式,则必须传递model action and classes // return the result set function test(name) { return people.filter(function(person){ return person.name === 'John'; }); }