Không có @ Html.Button!


81

điều này thật kỳ lạ. Tôi thấy các tài liệu tham khảo cho @ Html.Button () nhưng khi tôi nhập Intellisense đó không tìm thấy một trình trợ giúp nào như vậy ... có danh sách thả xuống, ẩn, trình chỉnh sửa, v.v., nhưng không có nút!

có chuyện gì vậy


Bạn thấy những tài liệu tham khảo như vậy ở đâu?
SLaks

1
Tôi hiểu mong muốn về sự nhất quán nhưng thực sự không cần một cái nào (không có gì để mã hóa hoặc bảo vệ chống lại) vì vậy tất cả sẽ là một cách lâu dài để viết một thẻ html duy nhất: '@ Html.Button ("myButton", mới {@class = "myClass"}) 'vs' <button class = "myClass"> myButton </button> '
Nine Tails

4
@Russel - Tôi không đồng ý - Tôi đã tạo các phương thức mở rộng trên MvcHtmlString để tắt, chỉ đọc và ẩn các phần tử DOM. Vì không có trình trợ giúp HTML cho các nút nên tôi không thể sử dụng các phương pháp mở rộng của mình. Nói 'không cần thiết' là một chút thiển cận và có thể là ngây thơ.
barrypicker

Câu trả lời:


69
public static class HtmlButtonExtension 
{

  public static MvcHtmlString Button(this HtmlHelper helper, 
                                     string innerHtml, 
                                     object htmlAttributes) 
  { 
    return Button(helper, innerHtml,
                  HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes)
    ); 
  }

  public static MvcHtmlString Button(this HtmlHelper helper, 
                                     string innerHtml,
                                     IDictionary<string, object> htmlAttributes)
  {
      var builder = new TagBuilder("button");
      builder.InnerHtml = innerHtml;
      builder.MergeAttributes(htmlAttributes);
      return MvcHtmlString.Create(builder.ToString());
  }
}

1
Phải ... họ phải có lý do chính đáng nào đó nếu không sẽ là một sai lầm lớn.
Andrei Rînea

Cảm ơn, tôi đã vào một dự án mới và ngạc nhiên khi thấy không có html.button
Tom Stickel

7
Nếu bạn muốn sử dụng các @Html.Button("ButtonText", new {Name = "name", Value = "value" })định dạng, thêm lớp này:public static MvcHtmlString Button(this HtmlHelper helper, string text, object htmlAttributes) { return Button(helper, text, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes)); }
Mason240

1
Tốt cuộc gọi @ Mason240. Tôi đã cập nhật câu trả lời của mình với tình trạng quá tải như bạn đề xuất.
jessegavin

whoa ... làm thế nào tôi chưa bao giờ thấy HtmlHelper.AnonymousObjectToHtmlAttributestrước đây?
drzaus

9

Không có trình trợ giúp nút nào kể từ bản xem trước mvc 3 (không phải mvc3)

nó đã được đề cập đến rất nhiều trong quá khứ, ví dụ: http://blog.wekeroad.com/blog/aspnet-mvc-preview-using-the-mvc-ui-helpers/ tuy nhiên việc tự lăn lộn của bạn là chuyện nhỏ - tôi có cơ sở Đối với nó ở đâu đó xung quanh đây, tôi sẽ phải đào nó lên, nhưng về cơ bản chỉ cần tạo một Html.ButtonFor mới và sao chép mã nguồn từ Html.LabelFor và thay đổi đầu ra để tạo thẻ input type = "button".


9

Để mở rộng câu trả lời được chấp nhận , vì vậy bạn có thể liên kết nút gửi với thuộc tính mô hình nhưng có văn bản khác:

@Html.ButtonFor(m => m.Action, Model.LabelForCurrentAction(), new { @class = "btn btn-primary btn-large", type = "submit" })

Sử dụng lớp trợ giúp được sửa đổi một chútButton sau :

/// <summary>
/// Via /programming/5955571/theres-no-html-button
/// </summary>
public static class HtmlButtonExtension
{

    public static MvcHtmlString Button(this HtmlHelper helper, object innerHtml, object htmlAttributes)
    {
        return helper.Button(innerHtml, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes));
    }

    public static MvcHtmlString Button(this HtmlHelper helper, object innerHtml, IDictionary<string, object> htmlAttributes)
    {
        var builder = new TagBuilder("button") { InnerHtml = innerHtml.ToString() };
        builder.MergeAttributes(htmlAttributes);
        return MvcHtmlString.Create(builder.ToString());
    }

    public static MvcHtmlString ButtonFor<TModel, TField>(this HtmlHelper<TModel> html,
                                                        Expression<Func<TModel, TField>> property,
                                                        object innerHtml,
                                                        object htmlAttributes)
    {
        // lazily based on TextAreaFor

        var attrs = HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes);

        var name = ExpressionHelper.GetExpressionText(property);
        var metadata = ModelMetadata.FromLambdaExpression(property, html.ViewData);

        string fullName = html.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(name);

        ModelState modelState;
        if (html.ViewData.ModelState.TryGetValue(fullName, out modelState) && modelState.Errors.Count > 0)
        {
            if( !attrs.ContainsKey("class") ) attrs["class"] = string.Empty;
            attrs["class"] += " " + HtmlHelper.ValidationInputCssClassName;
            attrs["class"] = attrs["class"].ToString().Trim();
        }
        var validation = html.GetUnobtrusiveValidationAttributes(name, metadata);
        if(null != validation) foreach(var v in validation) attrs.Add(v.Key, v.Value);

        string value;
        if (modelState != null && modelState.Value != null)
        {
            value = modelState.Value.AttemptedValue;
        }
        else if (metadata.Model != null)
        {
            value = metadata.Model.ToString();
        }
        else
        {
            value = String.Empty;
        }

        attrs["name"] = name;
        attrs["Value"] = value;
        return html.Button(innerHtml, attrs);
    }
}

8

MVC5, Bootstrap phiên bản 3.2.0

@Html.ActionLink
(
    linkText: " Remove", 
    actionName: "Index", 
    routeValues: null, // or to pass some value -> routeValues: new { id = 1 },
    htmlAttributes: new { @class = "btn btn-success btn-sm glyphicon glyphicon-remove" }
)

Điều này sẽ tạo ra một liên kết trông giống như một nút.


2
"Bootstrap 3" là gì?
ekkis

1
Tôi xin lỗi, tôi đã gõ sai từ. Tất nhiên, ý tôi là Bootstrap. Cảm ơn ekkis. liên kết
Piotr Knut

1
Thao tác này không tạo ra một nút, thay vào đó là một liên kết trông giống như một nút.
SMUsamaShah

2
Đối với tôi, điều này không thể biên dịch nếu dấu ngoặc đơn mở không cùng dòng với ActionLink.
GaTechThomas

GaTechThomas. Vâng đúng vậy. Mọi thứ nên nằm trong một dòng. Tôi đã định dạng lại nó theo cách này dễ đọc hơn. Tốt nhất là tạo nút của riêng bạn (hoặc thứ gì khác), nhưng nếu bạn không có thời gian để làm hoặc không lo lắng về sự xuất hiện của nó thì đó là một giải pháp nhanh chóng.
Piotr Knut

1

Razor dường như không có trình trợ giúp HTML "Nút". Bạn có thể tìm thấy các tham chiếu đến tiện ích mở rộng trình trợ giúp HTML được tạo tùy chỉnh.

Xem tại đây: http://www.asp.net/mvc/tutorials/creating-custom-html-helpers-cs


1
điều đó không có vẻ kỳ lạ phải không? đặc biệt nếu nó tầm thường, tại sao không bao gồm nó cho đầy đủ ??
ekkis

Tôi đã đọc qua tài liệu đó nhưng tôi không thể làm cho nó hoạt động. Tôi đã đặt trình trợ giúp của mình trong một tệp có tên HtmlHelpers.cs trong thư mục gốc của dự án và nó chứa một lớp tĩnh HtmlHelpers với phương thức tĩnh công khai trả về một chuỗi có tham số duy nhất là "trình trợ giúp HtmlHelper này". mọi thứ biên dịch và .Button sẽ xuất hiện trong Intellisense nhưng nó không ... tôi phải làm gì khác đây?
ekkis

1
bạn đã bao gồm câu lệnh nhập cho vùng tên tiện ích mở rộng của mình ở đầu chế độ xem của bạn chưa? đó là vấn đề thông thường ở đây. bạn có thể muốn đảm bảo rằng các chế độ xem của mình được biên dịch (nhấp chuột phải vào dự án, chọn dỡ bỏ. nhấp chuột phải để chỉnh sửa tệp - đặt MvcBuildViews thành true. lưu và đóng, nhấp chuột phải và tải lại dự án và biên dịch lại.
Adam Tuliper - MSFT

1
tạo một thư mục được gọi là phần mở rộng. thêm lớp htmlextensions.cs vào đó (đảm bảo không gian tên chính xác) và sau đó trong chế độ xem của bạn, sử dụng: @using Yourapp .Extensions cũng bật MvcBuildViews bằng notepad nếu bạn đang gặp sự cố.
Adam Tuliper - MSFT

1
Ekkis, Không chắc bạn đã làm gì với dự án của mình nhưng bạn cần làm những việc sau để tạo HtmlHelperExtension: 1) Tạo một lớp tĩnh (tôi gọi là HtmlHelperExtensions của tôi) 2) Trong lớp đó, hãy tạo các phương thức công khai, chú thích là <Phần mở rộng ( )>, với chữ ký thích hợp. 3) Trả về MvcHtmlString.Create (). Xem bài đăng này để biết ví dụ hữu ích và chức năng: stackoverflow.com/questions/4896439/action-image-mvc3-razor
Ben Finkel
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.