ASP.NET MVC – obrazek jako link do asynchronicznego wywołania

W poprzednich postach pokazałem jak tworzyć asynchroniczne formularze. Nie zawsze jednak chcemy wywoływać takie zapytania za pomocą przycisku Submit. Czasami lepiej użyć linku tekstowego lub po prostu obrazka. Ajaxowy link tekstowy bardzo łatwo utworzyć za pomocą metody ActionLink:

<%=Ajax.ActionLink("Usuń","RemoveAssocation",new AjaxOptions(){}) %>

Pytanie jednak co zrobić aby obrazek posłużył jako ajaxowy link? W poście przedstawię może nieeleganckie ale za to bardzo proste rozwiązanie:

<%= Ajax.ActionLink("[replacethis]", ...).Replace("[replacethis]", "<img src=\"/images/remove.gif\" ... />" %> 

Najpierw generujemy zwykły, tekstowy link (<a href=’…’>[replacethis]</a>), a następnie wystarczy zamiast tekstu wstawić obrazek (metoda Replace). Dla porządku w kodzie można napisać rozszerzenie do AjaxHelpera:

static public class AjaxHelperEx
{
   public static string ImageActionLink(this AjaxHelper helper, string imageUrl, string altText, string actionName, object routeValues, AjaxOptions ajaxOptions)
   {
       var builder = new TagBuilder("img");
       builder.MergeAttribute("src", imageUrl);
       builder.MergeAttribute("alt", altText);
       string link = helper.ActionLink("[replaceme]", actionName, routeValues, ajaxOptions).ToHtmlString();            
       return link.Replace("[replaceme]", builder.ToString(TagRenderMode.SelfClosing));
   } 
}

Teraz w widoku wystarczy, że wywołamy:

<%=Ajax.ImageActionLink("/images/remove.png","Usuń","RemoveAssocation",null,new AjaxOptions(){}) %>

Leave a Reply

Your email address will not be published.