HTML को Html.ActionLink (), प्लस कोई लिंक पाठ के अंदर लाना?

Question

मेरे दो सवाल हैं:

1. मैं सोच रहा हूं कि Html.ActionLink()एमवीसी दृश्य (वास्तव में, यह है Site.Master) का उपयोग करते समय मैं कोई लिंक पाठ कैसे प्रदर्शित कर सकता हूं ।

एक अतिभारित संस्करण नहीं है जो लिंक पाठ की अनुमति नहीं देता है, और जब मैं सिर्फ एक खाली में गुजरने की कोशिश करता हूं string, तो संकलक मुझे बताता है कि इसे एक गैर-रिक्त स्ट्रिंग की आवश्यकता है।

मैं इसे कैसे ठीक करूं?

2. मुझे <span>एंकर टैग के भीतर टैग लगाने की आवश्यकता है , लेकिन इसके साथ काम नहीं कर रहा है Html.ActionLink();। मैं निम्नलिखित आउटपुट देखना चाहूंगा:

   स्पान पाठ

मैं ASP.NET MVC में एंकर टैग के अंदर टैग कैसे लगा सकता हूं?

Comments

रिक्त कार्रवाई लिंक होने का उद्देश्य / उपयोग क्या होगा?

— डेविड

मैं एक नेविगेशन बार के लिए एक छवि स्प्राइट का उपयोग कर रहा हूं, और <li>आप देख रहे हैं कि एक विशेष नेविगेशन बटन है (साइज़, बैकग्राउंड पॉज़, आदि सीएसएस स्टाइलशीट में निर्दिष्ट है)। लेकिन यह किसी चीज़ से लिंक होना चाहिए, इसलिए मैं टेक्स्ट प्रदर्शित नहीं करना चाहता। मैं चाहता हूं कि स्प्राइट मेरे लिए वही करे।

— मेगामेट

Answer 1

Html.ActionLink का उपयोग करने के बजाय आप Url.Action के माध्यम से एक url प्रस्तुत कर सकते हैं

<a href="<%= Url.Action("Index", "Home") %>"><span>Text</span></a>
<a href="@Url.Action("Index", "Home")"><span>Text</span></a>

और एक खाली यूआरएल करने के लिए आप कर सकते थे

<a href="<%= Url.Action("Index", "Home") %>"></a>
<a href="@Url.Action("Index", "Home")"></a>

Comments

मुझे <a href="@Url.Action("Index", "Home")"> <span> पाठ </ span> </a> का उपयोग करना पड़ा, मेरे देव पूछने के आस-पास नहीं हैं कि मुझे क्यों करना पड़ा लेकिन यह उपरोक्त उत्तर का उपयोग करने और इसे काम नहीं करने के लिए ट्रिंग करने वाले के लिए उपयोगी हो सकता है।

— डेव हाई जूल

@ Url.Action रेजर टेम्पलेट का उपयोग करते समय होता है। मैंने उत्तर अपडेट कर दिया है ताकि आप दोनों देख सकें।

— डेविड

<a href=@Url.Action("Create", "Product")><span>Create</span></a>भी काम करता है। उद्धरण आवश्यक नहीं हैं।

— डेविड

स्थिर सामग्री के लिए क्यों नहीं सीधे html टाइप करें? यह कम

— क्रिया

यदि आप अजाक्स का उपयोग करना चाहते हैं तो Asp.Net Core 2 में कोई वास्तविक विकल्प नहीं है।

— जोर्किंड

Answer 2

एक कस्टम HtmlHelper एक्सटेंशन एक और विकल्प है। नोट : पैरामीटर मेरा अपना प्रकार है। आप एक रूटवैल्यूड को स्थानापन्न कर सकते हैं लेकिन आपको इसका निर्माण अलग तरीके से करना होगा।

public static string ActionLinkSpan( this HtmlHelper helper, string linkText, string actionName, string controllerName, object htmlAttributes )
{
    TagBuilder spanBuilder = new TagBuilder( "span" );
    spanBuilder.InnerHtml = linkText;

    return BuildNestedAnchor( spanBuilder.ToString(), string.Format( "/{0}/{1}", controllerName, actionName ), htmlAttributes );
}

private static string BuildNestedAnchor( string innerHtml, string url, object htmlAttributes )
{
    TagBuilder anchorBuilder = new TagBuilder( "a" );
    anchorBuilder.Attributes.Add( "href", url );
    anchorBuilder.MergeAttributes( new ParameterDictionary( htmlAttributes ) );
    anchorBuilder.InnerHtml = innerHtml;

    return anchorBuilder.ToString();
}

Answer 3

यहां आपको अजाक्स या कुछ विशेषता का उपयोग करने की आवश्यकता है (कम और गंदे) वर्कअराउंड जो कि आप मैन्युअल रूप से लिंक बनाते समय (टैग का उपयोग करके) उपयोग नहीं कर सकते हैं:

<%= Html.ActionLink("LinkTextToken", "ActionName", "ControllerName").ToHtmlString().Replace("LinkTextToken", "Refresh <span class='large sprite refresh'></span>")%>

आप 'LinkTextToken' के बजाय किसी भी पाठ का उपयोग कर सकते हैं, यह केवल प्रतिस्थापित करने के लिए है, यह केवल महत्वपूर्ण है कि यह एक्शनलिंक के अंदर कहीं और नहीं होता है।

Comments

+1 अच्छा विचार। रेजर में, आपको उस सब का बलात्कार करना होगाHtml.Raw()

— कैरी केंडल

धन्यवाद :) अब जब मैंने देखा कि हम क्या उपयोग करते हैं, मैं लगभग शर्मिंदा हो जाता हूं, सर्वर पर इन चीजों को करना सर्वर संसाधनों की ऐसी बर्बादी है ...

— गोरान ओब्राडोविक

जैसा कि मैं @ Ajax.ActionLink का उपयोग कर रहा हूं और सभी date-विशेषताओं को मैन्युअल रूप से सेट करने का मन नहीं कर रहा है , यह मेरे लिए सबसे अच्छा समाधान है। +1

— asontu

धन्यवाद, एक आकर्षण की तरह काम किया जब मैं भी Ajax.ActionLink का उपयोग कर रहा था। यह कुछ भी धीमा नहीं लगता था और मुझे वही लेआउट और स्टाइल रखने के लिए मिला।

— ब्लैकी वुल्फ

बस कहना चाहता हूँ, यह .Net कोर में काम नहीं करता है, ToHtmlString () v2 में हटा दिया गया है v1 के बारे में निश्चित नहीं

— Zorkind

Answer 4

Url.Actionइसके बजाय बस का उपयोग करें Html.ActionLink:

<li id="home_nav"><a href="<%= Url.Action("ActionName") %>"><span>Span text</span></a></li>

Comments

@CraigStunz हमें Html.ActionLink के बजाय Url.Action का उपयोग क्यों करना चाहिए?

— रॉक्सी’प्रो

Answer 5

इसने हमेशा मेरे लिए अच्छा काम किया है। यह गन्दा और बहुत साफ नहीं है।

<a href="@Url.Action("Index", "Home")"><span>Text</span></a>

Comments

Url.Action में एक कंस्ट्रक्टर नहीं है जो htmlAttributes लेगा। एक्शनलिंक के समान नहीं।

— बैरीपिकार

Answer 6

मैं एक कस्टम एक्सटेंशन विधि के साथ समाप्त हुआ। इसकी ध्यान देने योग्य बात, जब HTML को एंकर ऑब्जेक्ट के अंदर रखने की कोशिश की जाती है, तो लिंक टेक्स्ट या तो बाईं ओर हो सकता है, या आंतरिक HTML के दाईं ओर हो सकता है। इस कारण से, मैंने बाएं और दाएं आंतरिक HTML के लिए पैरामीटर प्रदान करने का विकल्प चुना - लिंक पाठ बीच में है। बाएँ और दाएँ दोनों आंतरिक HTML वैकल्पिक हैं।

एक्सटेंशन विधि ActionLinkInnerHtml:

    public static MvcHtmlString ActionLinkInnerHtml(this HtmlHelper helper, string linkText, string actionName, string controllerName, RouteValueDictionary routeValues = null, IDictionary<string, object> htmlAttributes = null, string leftInnerHtml = null, string rightInnerHtml = null)
    {
        // CONSTRUCT THE URL
        var urlHelper = new UrlHelper(helper.ViewContext.RequestContext);
        var url = urlHelper.Action(actionName: actionName, controllerName: controllerName, routeValues: routeValues);

        // CREATE AN ANCHOR TAG BUILDER
        var builder = new TagBuilder("a");
        builder.InnerHtml = string.Format("{0}{1}{2}", leftInnerHtml, linkText, rightInnerHtml);
        builder.MergeAttribute(key: "href", value: url);

        // ADD HTML ATTRIBUTES
        builder.MergeAttributes(htmlAttributes, replaceExisting: true);

        // BUILD THE STRING AND RETURN IT
        var mvcHtmlString = MvcHtmlString.Create(builder.ToString());
        return mvcHtmlString;
    }

उपयोग का उदाहरण:

यहाँ उपयोग का एक उदाहरण है। इस उदाहरण के लिए मैं केवल लिंक पाठ के दाईं ओर भीतरी HTML चाहता था ...

@Html.ActionLinkInnerHtml(
    linkText: "Hello World"
        , actionName: "SomethingOtherThanIndex"
        , controllerName: "SomethingOtherThanHome"
        , rightInnerHtml: "<span class=\"caret\" />"
        )

परिणाम:

निम्नलिखित HTML में यह परिणाम ...

<a href="/SomethingOtherThanHome/SomethingOtherThanIndex">Hello World<span class="caret" /></a>

Answer 7

मैंने सोचा कि बूटस्ट्रैप और कुछ ग्लाइपिकॉन का उपयोग करते समय यह उपयोगी हो सकता है:

<a class="btn btn-primary" 
    href="<%: Url.Action("Download File", "Download", 
    new { id = msg.Id, distributorId = msg.DistributorId }) %>">
    Download
    <span class="glyphicon glyphicon-paperclip"></span>
</a>

यह एक ए टैग दिखाएगा, एक नियंत्रक के लिंक के साथ, एक अच्छा पेपरक्लिप आइकन के साथ एक डाउनलोड लिंक का प्रतिनिधित्व करने के लिए, और HTML आउटपुट को साफ रखा गया है

Answer 8

यहाँ @ tvanfosson के उत्तर का एक uber विस्तार है। मैं इससे प्रेरित था और इसे और अधिक सामान्य बनाने का निर्णय लेता हूं।

    public static MvcHtmlString NestedActionLink(this HtmlHelper htmlHelper, string linkText, string actionName,
        string controllerName, object routeValues = null, object htmlAttributes = null,
        RouteValueDictionary childElements = null)
    {
        var htmlAttributesDictionary = HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes);

        if (childElements != null)
        {
            var urlHelper = new UrlHelper(htmlHelper.ViewContext.RequestContext);

            var anchorTag = new TagBuilder("a");
            anchorTag.MergeAttribute("href",
                routeValues == null
                    ? urlHelper.Action(actionName, controllerName)
                    : urlHelper.Action(actionName, controllerName, routeValues));
            anchorTag.MergeAttributes(htmlAttributesDictionary);
            TagBuilder childTag = null;

            if (childElements != null)
            {
                foreach (var childElement in childElements)
                {
                    childTag = new TagBuilder(childElement.Key.Split('|')[0]);
                    object elementAttributes;
                    childElements.TryGetValue(childElement.Key, out elementAttributes);

                    var attributes = HtmlHelper.AnonymousObjectToHtmlAttributes(elementAttributes);

                    foreach (var attribute in attributes)
                    {
                        switch (attribute.Key)
                        {
                            case "@class":
                                childTag.AddCssClass(attribute.Value.ToString());
                                break;
                            case "InnerText":
                                childTag.SetInnerText(attribute.Value.ToString());
                                break;
                            default:
                                childTag.MergeAttribute(attribute.Key, attribute.Value.ToString());
                                break;
                        }
                    }
                    childTag.ToString(TagRenderMode.SelfClosing);
                    if (childTag != null) anchorTag.InnerHtml += childTag.ToString();
                }                    
            }
            return MvcHtmlString.Create(anchorTag.ToString(TagRenderMode.Normal));
        }
        else
        {
            return htmlHelper.ActionLink(linkText, actionName, controllerName, routeValues, htmlAttributesDictionary);
        }
    }

Comments

यह बहुत अच्छा है कि आप प्रेरित थे और ऐसा करने की क्षमता रखते हैं। हालाँकि, मैं नेस्टेड फ़र्ज़ी बयानों को देखता हूँ और चलाना चाहता हूँ। यह ज्यादातर डेवलपर्स द्वारा बनाए रखने योग्य नहीं है। यदि यह पत्थर के ब्लैक बॉक्स प्रकार विस्तार विधि में सुंदर सेट है, तो संभवतः ठीक है, लेकिन इसके पास एक कोड गंध है। बहुत आसान है कि कुछ के लिए आंखों पर आसान नहीं है। यद्यपि आपके प्रयासों के लिए धन्यवाद।

— टॉम स्टिकेल

मैं छोरों के लिए नेस्टेड के बारे में बहुत सहमत हूं। सक्सेस की खातिर यह वहीं है। ऑप्टिमाइज़ेशन स्टैंड पॉइंट से हाँ लूप के लिए नेस्टेड अपनी निजी विधि में होना चाहिए, और मापदंडों को मुखर करने की आवश्यकता है, कोड को बहुत अधिक रक्षात्मक होने की आवश्यकता है, आदि

— william-kid

Answer 9

यह बहुत सरल है।

यदि आप ग्लिफ़िकॉन आइकन जैसा कुछ चाहते हैं और फिर "विश लिस्ट",

<span class="glyphicon-heart"></span> @Html.ActionLink("Wish List (0)", "Index", "Home")

Answer 10

बूटस्ट्रैप घटकों का उपयोग करके मेरा समाधान:

<a class="btn btn-primary" href="@Url.Action("resetpassword", "Account")">
    <span class="glyphicon glyphicon-user"></span> Reset Password
</a>

Answer 11

कृपया नीचे दिए गए कोड की कोशिश करें जो आपकी मदद कर सकते हैं।

 @Html.ActionLink(" SignIn", "Login", "Account", routeValues: null, htmlAttributes: new {  id = "loginLink" ,**@class="glyphicon glyphicon-log-in"** }) 

Comments

बस सरल जोड़, @ वर्ग और फिर वास्तविक सीएसएस वर्ग मेरी समस्या को हल करने में मेरी मदद करता है

— अहसानुल