2011-12-15 16 views
7

Come posso inserire un elemento span all'interno di ActionLink MA NON CON URL.ACTION?Come inserire l'elemento span in ActionLink MVC3?

questo:

<li><span> 
    @Ajax.ActionLink("LinkText", "ControllerName", new AjaxOptions 
       { 
        UpdateTargetId = "div", 
        InsertionMode = InsertionMode.Replace, 
        HttpMethod = "GET", 
        LoadingElementId = "progress" 

       }) 
</span></li> 

genera questo:

<li> 
<span> 
<a href="/Home/ControllerName" data-ajax-update="#scroll" 
data-ajax-mode="replace" data-ajax-method="GET" 
data-ajax-loading="#progress" data-ajax="true">LinkText</a> 
</span> 
</li> 

Ma ho bisogno di qualcosa d'altro. Come posso creare un metodo MVC3 ActionLink personalizzato che genera questo output:

<li> 
    <a href="/Home/ControllerName" data-ajax-update="#scroll" 
    data-ajax-mode="replace" data-ajax-method="GET" 
    data-ajax-loading="#progress" data-ajax="true"> 

    <span>LinkText</span> // this span generated inside <a> 

    </a> 
</li> 
+0

http://stackoverflow.com/questions/3470622/wrapping-an-element-with-html-actionlink – Ali

risposta

8

Come mettere elemento arco all'interno ActionLink ma non con URL.ACTION

Risposta semplice: non si può. Il metodo ActionLink HTML codifica il testo del collegamento e non c'è molto che si possa fare a riguardo (è possibile aprire un ticket su Microsoft in modo da fornire un sovraccarico che consente di farlo in ASP.NET MVC vNext).

Al momento si potrebbe scrivere un aiutante HTML personalizzato che non codificare:

public static class AjaxExtensions 
{ 
    public static IHtmlString MyActionLink(
     this AjaxHelper ajaxHelper, 
     string linkText, 
     string actionName, 
     AjaxOptions ajaxOptions 
    ) 
    { 
     var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, null, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true); 
     return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkText, targetUrl, ajaxOptions ?? new AjaxOptions(), null)); 
    } 

    private static string GenerateLink(
     this AjaxHelper ajaxHelper, 
     string linkText, 
     string targetUrl, 
     AjaxOptions ajaxOptions, 
     IDictionary<string, object> htmlAttributes 
    ) 
    { 
     var a = new TagBuilder("a") 
     { 
      InnerHtml = linkText 
     }; 
     a.MergeAttributes<string, object>(htmlAttributes); 
     a.MergeAttribute("href", targetUrl); 
     a.MergeAttributes<string, object>(ajaxOptions.ToUnobtrusiveHtmlAttributes()); 
     return a.ToString(TagRenderMode.Normal); 
    } 
} 

e poi:

@Ajax.MyActionLink(
    "<span>LinkText</span>", 
    "ActionName", 
    new AjaxOptions { 
     UpdateTargetId = "div", 
     InsertionMode = InsertionMode.Replace, 
     HttpMethod = "GET", 
     LoadingElementId = "progress" 
    } 
) 
+1

Puoi fornire un esempio di questo aiuto personalizzato? –

+0

@Ingol, sicuro, vedere il mio aggiornamento. –

+1

grazie, questo dovrebbe fare! –

2

So che questo è vecchio, ma io uso questo modo veloce e sporco per aggiungere link a pulsanti in stile nelle mie griglie. È possibile aggiungere sovraccarichi per includere nomi di percorsi/ecc. anche. Spero che questo aiuti qualcuno.

2

Ho modificato le risposte dei dorsi solo un po 'per poter ospitare RouteValues.

 

    public static class AjaxExtensions 
    { 
     public static IHtmlString MyActionLink(
      this AjaxHelper ajaxHelper, 
      string linkText, 
      string actionName, 
      AjaxOptions ajaxOptions 
     ) 
     { 
      var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, null, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true); 
      return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkText, targetUrl, ajaxOptions ?? new AjaxOptions(), null)); 
     } 

     public static IHtmlString MyActionLink(
      this AjaxHelper ajaxHelper, 
      string linkText, 
      string actionName, 
      object routeValues, 
      AjaxOptions ajaxOptions 
     ) 
     { 
      System.Web.Routing.RouteValueDictionary routeVals = new System.Web.Routing.RouteValueDictionary(routeValues); 

      var targetUrl = UrlHelper.GenerateUrl(null, actionName, null, routeVals, ajaxHelper.RouteCollection, ajaxHelper.ViewContext.RequestContext, true); 
      return MvcHtmlString.Create(ajaxHelper.GenerateLink(linkText, targetUrl, ajaxOptions ?? new AjaxOptions(), null)); 
     } 


     private static string GenerateLink(
      this AjaxHelper ajaxHelper, 
      string linkText, 
      string targetUrl, 
      AjaxOptions ajaxOptions, 
      IDictionary htmlAttributes 
     ) 
     { 
      var a = new TagBuilder("a") 
      { 
       InnerHtml = linkText 
      }; 
      a.MergeAttributes(htmlAttributes); 
      a.MergeAttribute("href", targetUrl); 
      a.MergeAttributes(ajaxOptions.ToUnobtrusiveHtmlAttributes()); 
      return a.ToString(TagRenderMode.Normal); 
     } 

    } 
 
0

Quanto è difficile ottenere ciò utilizzando JQuery?

Possiamo sempre utilizzare JQuery e aggiungere <span></span> dopo aver caricato il DOM.

Potrebbe non essere la soluzione perfetta ma per gli sviluppatori che utilizzano jquery e non vogliono scrivere classi di helper html come sopra la risposta potrebbe essere il lavoro da svolgere.

1

So che questo è un vecchio thread, ma si può anche fare qualcosa di linea lungo le linee di:

<li><span> 
@{ 
    var lnk = Ajax.ActionLink("LinkText", "ControllerName", new AjaxOptions { 
       UpdateTargetId = "div", 
       InsertionMode = InsertionMode.Replace, 
       HttpMethod = "GET", 
       LoadingElementId = "progress" 
      }); 
@Html.Raw(lnk.ToString().Replace(">LinkText<", "><span>LinkText</span><")); 
// Remember to include the open and closing >< ! 
} 
</span></li> 

Il suo un hack lo so, ma si potrebbe facilmente scrivere un'estensione in questo senso