ASP.NET MVCのActionLinkに相当する画像
ASP.NET MVCには、ImgタグのHtml.ActionLinkヘルパーに相当するものがありますか？
動的に生成されたJPEGを出力するコントローラーアクションがあり、ActionLinkを使用してHREFを実行するときと同じLambda式を使用してリンクしたいと考えました。
あるいは、URLを単にルートに渡すヘルパー（再びLambdasを使用して指定される）も受け入れられます。
[〜＃〜] edit [〜＃〜]：プレビュー5を使用することを当初指定していましたが、ベータ版がリリースされたことがわかります。だから、私はすぐにアップグレードするかもしれないので、すべてのバージョン番号は不要な情報でした:-)
Url.Action（）は、Html.ActionLinkのほとんどのオーバーロードのベアURLを取得しますが、これまでのURLからのラムダ機能はHtml.ActionLinkを介してのみ利用可能であると思います。願わくば、ある時点で同様のオーバーロードをUrl.Actionに追加することを願っています。
URL.Actionメソッドを使用できます
<a href="<%= Url.Action("Create") %>"><img src="../../Content/Images/add_48.png" /></a>
この質問は古く、最近RCが公開されたときにASP.NET MVCで始めたばかりですが、後でこの質問を見つけた人にとっては興味深いかもしれません。
少なくともRCでは、匿名型でもUrl.Action（）を使用できます。結果は上記の提案よりもずっときれいに見えます。
<a href="<%= Url.RouteUrl("MyRoute", new { param1 = "bla", param2 = 5 }) %>">
put in <span>whatever</span> you want, also <img src="a.gif" alt="images" />.
</a>
もちろん、RouteUrlには他にも多くのオーバーロードがあります。
回避策を使用して、ActionLinkのテキストの代わりにマーカーを配置し、それをイメージコードに置き換えます。このようなもの：
<%= Html.ActionLink("__IMAGE_PLACEHOLDER__", "Products").Replace("__IMAGE_PLACEHOLDER__", "<img src=\"" + myImgUrl + "\" />")%>
最もエレガントなソリューションではありませんが、機能します。
MVC3では、リンクは次のようになります。
<a href="@Url.Action("Create")"><img src="../../Content/Images/add_48.png" /></a>
ASP.NET MVCベータ版では、Futures Assembly（デフォルトのASP.NET MVCインストールに含まれていない）でHtml.BuildUrlFromExpressionメソッドを使用できます。 、しかし、 CodePlex ）から利用できます。次のように、ラムダスタイルのActionLink構文を使用して、イメージ（または任意のHTML）の周りにリンクを作成します。
<a href="<%=Html.BuildUrlFromExpression<MyController>(c => c.MyAction())%>">
<%=Html.Image("~/Content/MyImage.gif")%>
</a>
画像リンクをフチ無しに保つには、次のようなCSSルールを追加する必要があります。
img
{
border: none;
}
このコントロールを使用できます。ActionLinkのように動作します。
http://agilefutures.com/index.php/2009/06/actionimage-aspnet-mvc
MVC 2で実現するのは非常に簡単です。Url.ActionヘルパーのLambda式をサポートする独自の非常に単純な拡張メソッドを作成しました。 MVC 2 Futuresを参照する必要があります。
コードは次のとおりです。
using System;
using System.Linq.Expressions;
using System.Web.Mvc;
using System.Web.Routing;
using ExpressionHelperInternal=Microsoft.Web.Mvc.Internal.ExpressionHelper;
namespace Bnv.Bssi.Web.Infrastructure.Helpers
{
public static class UrlExtensions
{
public static string Action<TController>(this UrlHelper helper, Expression<Action<TController>> action) where TController : Controller
{
RouteValueDictionary routeValuesFromExpression = ExpressionHelperInternal.GetRouteValuesFromExpression<TController>(action);
return helper.Action(routeValuesFromExpression["action"].ToString(), routeValuesFromExpression);
}
}
}
これがあなたの使い方です：
<img src="<%= Url.Action<YourController>(c => c.YourActionMethod(param1, param2)); %>" />
私の投稿が遅すぎることは知っていますが、共有したいです:)
次のような新しい拡張メソッドを追加しました：
public static class ImageExtensions
{
public static MvcHtmlString ImageLink(this HtmlHelper htmlHelper, string imgSrc, string additionalText = null, string actionName = null, string controllerName = null, object routeValues = null, object linkHtmlAttributes = null, object imgHtmlAttributes = null)
{
var urlHelper = ((Controller)htmlHelper.ViewContext.Controller).Url;
var url = "#";
if (!string.IsNullOrEmpty(actionName))
url = urlHelper.Action(actionName, controllerName, routeValues);
var imglink = new TagBuilder("a");
imglink.MergeAttribute("href", url);
imglink.InnerHtml = htmlHelper.Image(imgSrc, imgHtmlAttributes) + " " + additionalText;
linkHtmlAttributes = new RouteValueDictionary(linkHtmlAttributes);
imglink.MergeAttributes((IDictionary<string, object>)linkHtmlAttributes, true);
return MvcHtmlString.Create(imglink.ToString());
}
public static MvcHtmlString Image(this HtmlHelper htmlHelper, string imgSrc, object imgHtmlAttributes = null)
{
var imgTag = new TagBuilder("img");
imgTag.MergeAttribute("src", imgSrc);
if (imgHtmlAttributes != null)
{
imgHtmlAttributes = new RouteValueDictionary(imgHtmlAttributes);
imgTag.MergeAttributes((IDictionary<string, object>)imgHtmlAttributes, true);
}
return MvcHtmlString.Create(imgTag.ToString());
}
}
これが役に立てば幸いです。
Url.Content（）はあなたが探しているものですか？
Url.Content（ "〜/ path/to/something.jpg"）のように指定すると、アプリケーションルートに基づいて適切なパスに変換されます。
-ジョシュ
上記の答えを取り、ラッパー拡張機能を少し作成しました。
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string src, string altText, UrlHelper url, string actionName, string controllerName)
{
return ActionImageLink(helper, src, altText, url, actionName, controllerName, null, null);
}
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string src, string altText, UrlHelper url, string actionName, string controllerName, Dictionary<string, string> linkAttributes, Dictionary<string, string> imageAttributes)
{
return ActionImageLink(helper, src, altText, url, actionName, controllerName, null, linkAttributes, imageAttributes);
}
public static MvcHtmlString ActionImageLink(this HtmlHelper helper, string src, string altText, UrlHelper url, string actionName, string controllerName, dynamic routeValues, Dictionary<string, string> linkAttributes, Dictionary<string, string> imageAttributes)
{
var linkBuilder = new TagBuilder("a");
linkBuilder.MergeAttribute("href", routeValues == null ? url.Action(actionName, controllerName) : url.Action(actionName, controllerName, routeValues));
var imageBuilder = new TagBuilder("img");
imageBuilder.MergeAttribute("src", url.Content(src));
imageBuilder.MergeAttribute("alt", altText);
if (linkAttributes != null)
{
foreach (KeyValuePair<string, string> attribute in linkAttributes)
{
if (!string.IsNullOrWhiteSpace(attribute.Key) && !string.IsNullOrWhiteSpace(attribute.Value))
{
linkBuilder.MergeAttribute(attribute.Key, attribute.Value);
}
}
}
if (imageAttributes != null)
{
foreach (KeyValuePair<string, string> attribute in imageAttributes)
{
if (!string.IsNullOrWhiteSpace(attribute.Key) && !string.IsNullOrWhiteSpace(attribute.Value))
{
imageBuilder.MergeAttribute(attribute.Key, attribute.Value);
}
}
}
linkBuilder.InnerHtml = MvcHtmlString.Create(imageBuilder.ToString(TagRenderMode.SelfClosing)).ToString();
return MvcHtmlString.Create(linkBuilder.ToString());
}
とにかく私にとってそれが簡単になった、それが他の誰かを助けることを願っています。
ここでは良い解決策ですが、アクションリンクに画像だけを追加したい場合はどうでしょうか？これは私がそれを行う方法です：
@using (Html.BeginForm("Action", "Controler", ajaxOptions))
{
<button type="submit">
<img src="image.png" />
</button>
}
欠点は、ボタン要素に少しスタイリングしなければならないことですが、必要なすべてのhtmlをそこに入れることができます。
そして、Ajaxヘルパーでも動作します： https://stackoverflow.com/a/19302438/961139
Html.Imageの出力をHtml.ImageLinkヘルパーに入れようとしました。
@(new HtmlString(Html.ActionLink(Html.Image("image.gif").ToString(), "myAction", "MyController").ToString().Replace("<", "<").Replace(">", ">")))
私にとっての問題は、ActionLink名がエンコードされているため、<の代わりに＆ltが使用されることです。
このエンコードを削除しただけで、結果はうまくいきました。 （置換を使用する代わりにこれを行うより良い方法はありますか？）
他の投稿に追加：私の場合（asp.net mvc 3）言語セレクターとして機能する画像リンクが欲しかったので、次のようになりました：
public static MvcHtmlString ImageLink(this HtmlHelper htmlHelper, string imgSrc, string cultureName, object htmlAttributes, object imgHtmlAttributes, string languageRouteName = "lang", bool strictSelected = false)
{
UrlHelper urlHelper = ((Controller)htmlHelper.ViewContext.Controller).Url;
TagBuilder imgTag = new TagBuilder("img");
imgTag.MergeAttribute("src", imgSrc);
imgTag.MergeAttributes((IDictionary<string, string>)imgHtmlAttributes, true);
var language = htmlHelper.LanguageUrl(cultureName, languageRouteName, strictSelected);
string url = language.Url;
TagBuilder imglink = new TagBuilder("a");
imglink.MergeAttribute("href", url);
imglink.InnerHtml = imgTag.ToString();
imglink.MergeAttributes((IDictionary<string, string>)htmlAttributes, true);
//if the current page already contains the language parameter make sure the corresponding html element is marked
string currentLanguage = htmlHelper.ViewContext.RouteData.GetRequiredString("lang");
if (cultureName.Equals(currentLanguage, StringComparison.InvariantCultureIgnoreCase))
{
imglink.AddCssClass("selectedLanguage");
}
return new MvcHtmlString(imglink.ToString());
}
内部化のサポートは、言語ルートを介して行われました-元のソース ここ 。