0

Html.ActionLinkを使用して、1 つの列に WebGrid 定義と 3 つのリンクがあります。しかし、「 LinkText」プロパティを使用しないと、applicationIdプロパティがnull値 として Controller に渡されます。

一方、 " " の代わりに LinkTexts のみを使用すると、id パラメータを正常に渡すことができます (以下では "My Link Text" と入力します)。ただし、リンクにテキストを表示したくなく、画像を表示したかっただけです。

入力ミスがあるか、 @Url.Actionなどの MVC4 Razor に適した別の方法があると思います。Razorビューのコードは次のとおりです。

私を手伝ってくれますか？

前もって感謝します。

意見：

//for using multiple Html.ActionLink in a column using Webgrid
grid.Column("Operations", format: (item) =>
 new HtmlString(
       Html.ActionLink("My Link Text", "Edit", "Admin", new
       {
           applicantId = item.ApplicantID,               
           title = "Detail",
           @class = "icon-link",
           style = "background-image: url('../../Content/icons/detail.png')"
       }, null).ToString() +
       Html.ActionLink(" ", "Edit", "Admin", new
       {
           applicantId = item.ApplicantID, 
           title = "Edit",
           @class = "icon-link",
           style = "background-image: url('../../Content/icons/edit.png')"
       }, null).ToString() +
       Html.ActionLink(" ", "Edit", "Admin", new
       {
           applicantId = item.ApplicantID,
           title = "Delete",
           @class = "icon-link",
           style = "background-image: url('../../Content/icons/delete.png')"
       }, null).ToString()
 )
)



<style type="text/css">
    a.icon-link {
        background-color: transparent; 
        background-repeat: no-repeat; 
        background-position: 0px 0px;
        border: none;
        cursor: pointer; 
        width: 16px;
        height: 16px;
        margin-right: 8px; 
        vertical-align: middle;
    }
</style>
4

2 に答える 2

0

簡単に使用するために、カスタム HTML Helper メソッドを使用できます。これをする：

1) HtmlHelpers というフォルダーを作成し、このフォルダーに MyHelpers という名前のクラスを作成します。次に、以下のようにクラスを定義します (いくつかのプロパティを追加することで改善できます)。

MyHelpers.cs:

using System;
using System.Web.Mvc;

namespace <YourProjectName>.WebUI.HtmlHelpers
{
    public static class MyHelpers
    {            
        public static MvcHtmlString ImageLink(this HtmlHelper html, string imagePath, string alt, string cssClass,
           string action, string controllerName)
        {
            return ActionImage(html, imagePath, alt, cssClass, action, controllerName, null);
        }

        public static MvcHtmlString ImageLink(this HtmlHelper html, string imagePath, string alt, string cssClass,
           string action, string controllerName, object routeValues)
        {
            var currentUrl = new UrlHelper(html.ViewContext.RequestContext);
            var imgTagBuilder = new TagBuilder("img"); // build the <img> tag
            imgTagBuilder.MergeAttribute("src", currentUrl.Content(imagePath));
            imgTagBuilder.MergeAttribute("title", alt);
            imgTagBuilder.MergeAttribute("class", cssClass);
            string imgHtml = imgTagBuilder.ToString(TagRenderMode.SelfClosing);
            var anchorTagBuilder = new TagBuilder("a"); // build the <a> tag
            anchorTagBuilder.MergeAttribute("href", currentUrl.Action(action, controllerName, routeValues));
            anchorTagBuilder.InnerHtml = imgHtml; // include the <img> tag inside
            string anchorHtml = anchorTagBuilder.ToString(TagRenderMode.Normal);
            return MvcHtmlString.Create(anchorHtml);
        }
    }
}

2) プロジェクトをリビルドし、次の行を Razor ビューに追加します。

@using <YourProjectName>.WebUI.HtmlHelpers

3) 次に、ビューでこの Html ヘルパー メソッドを次のように使用します。

@Html.ImageLink("../../Content/icons/delete.png", "Delete", "your-class", "Delete", "Admin", new { item.ApplicantID })

同様に、同じ列で複数の画像リンクを使用する場合は、次のように html 文字列をマージできます。

意見：

....
grid.Column("Operations", style: "your-class", format: (item) =>
 new HtmlString(
      @Html.ActionImage("../../Content/icons/detail.png", "Detail", "your-class", "Detail", "Admin", new { item.ApplicantID }).ToString() +
      @Html.ActionImage("../../Content/icons/edit.png", "Edit", "your-class", "Edit", "Admin", new { item.ApplicantID }).ToString() +
      @Html.ActionImage("../../Content/icons/delete.png", "Delete", "your-class", "Delete", "Admin", new { item.ApplicantID }).ToString()

 )
)
...

お役に立てれば。よろしく...

于 2013-11-03T20:32:03.773 に答える
0

アクション リンクが正しく呼び出されていません。Html 属性をルート値に追加しています。アクション リンクは次のようになります。

   Html.ActionLink("My Link Text", "Detail", "Admin", new
   {
       applicantId = item.ApplicantID              
   }, new 
   {            
       title = "Detail",
       @class = "icon-link"
   })

このリンクをチェックして、リンク テキストを非表示にし、代わりに css を使用して画像を表示する方法を確認してください: CSS Hide Text But Show Image?

于 2013-11-05T19:12:07.613 に答える