Tạo phần mở rộng nút MVC Delete - Cách mở rộng trình trợ giúp Html của MVC?

Question

ASP.NET MVC 2 hiển thị liên kết (ví dụ: <a>) để xóa bản ghi.

Có thể có hại cho phép xóa các hành động thông qua các tác vụ GET, vì vậy tôi muốn xóa bằng cách phát hành POST.

tôi đã tạo ra những đoạn mã sau đây:

<% using (Html.BeginForm("Delete", "Boodschap", new { id = item.BoodschapID })) 
    { %> 
    <button>Delete</button> 
<% } %> 

Bây giờ tôi muốn thêm mã này vào các helper Html như một phương pháp khuyến nông:

public static MvcForm DeleteButton(this HtmlHelper helper, string name, 
    string actionName, string controllerName, string routeValues) 
{ 
    MvcForm form = helper.BeginForm(actionName, controllerName, routeValues); 
    return form; 
} 

Bây giờ đây là nơi tôi bị kẹt. Làm cách nào để có nút xóa này hoạt động?

Answer 1

Nếu bạn muốn tạo mã đầy đủ, bạn sẽ sai về việc trả lại mã số MvcForm. Bạn muốn có nó trả về một MvcHtmlString và xây dựng HTML trong phương thức. Bằng cách đó bạn có thể sử dụng nó như:

@Html.DeleteButton("Delete", "Boodschap", new { id = item.BoodschapID }); 

Tạo mã HTML trực tiếp (lưu ý: chưa được kiểm tra, bạn có thể cần kiểm tra rỗng thích hợp vv)

public static MvcHtmlString DeleteButton(this HtmlHelper helper, string name, 
    string actionName, object htmlAttributes) 
{ 
    return DeleteButton(helper, name, actionName, null, null, htmlAttributes); 
} 

public static MvcHtmlString DeleteButton(this HtmlHelper helper, string name, 
    string actionName, string controllerName, object routeValues, 
    object htmlAttributes) 
{ 
    var buttonBuilder = new TagBuilder("button"); 
    buttonBuilder.SetInnerText(name); 

    var formBuilder = new TagBuilder("form"); 
    var urlHelper = new UrlHelper(helper.ViewContext.RequestContext); 
    formBuilder.Attributes.Add("action", urlHelper.Action( 
     actionName, controllerName, routeValues)) 
    formBuilder.Attributes.Add("method", FormMethod.Post); 
    formBuilder.MergeAttributes(new RouteValueDictionary(htmlAttributes)); 
    formBuilder.InnerHtml = buttonBuilder.ToString(); 

    return new MvcHtmlString(formBuilder.ToString()); 
} 

Một thay thế sẽ được tái sử dụng các hình thức giúp đỡ và Response.Write, nhưng có phương pháp trả về một (trống) chuỗi, có lẽ cái gì đó như:

public static MvcHtmlString DeleteButton(this HtmlHelper helper, string name, string actionName, object routeValues) 
{ 
    return DeleteButton(helper, name, actionName, null, routeValues, null); 
} 

public static MvcHtmlString DeleteButton(this HtmlHelper helper, string name, string actionName, string controllerName, object routeValues, object htmlAttributes) 
{ 
    using (helper.BeginForm(actionName, controllerName, routeValues, FormMethod.Post, htmlAttributes)) 
    { 
     var response = helper.ViewContext.HttpContext.Response; 
     var builder = new TagBuilder("button"); 
     builder.SetInnerText(name); 
     response.Write(builder.ToString(TagRenderMode.Normal)); 
    } 
    return MvcHtmlString.Create(""); 
} 

Answer 2

trong khi tôi nghĩ rằng một yếu tố <form> sẽ làm các trick, nó không phải là rất AJAX-y.

Thay vào đó, tại sao không sử dụng jQuery, wire up to the click event cho các liên kết <a> thích hợp và sau đó issue an HTTP POST to the server yourself?

$document.ready(function() { 
    // "deleteLink is a class that identifies links that 
    // are used for deleting, you might have some other mechanism 
    $("a .deleteLink").click(function() { 
     $.post('post url', function(data) { 
      // Do something with the data returned 
     });  
    }); 
}); 

Lợi thế này là bạn giữ HTML của bạn nhiều sạch hơn nếu bạn chèn một <form> cho mỗi mục mà bạn muốn xóa, và ngữ nghĩa có liên quan, đánh dấu sạch luôn là một lợi thế từ một phát triển, SEO và các quan điểm khác.