Trying to convert this Html.Action Code to Html.ActionLink - asp.net-mvc

I am using MVC3, ASP.NET4.5 and Razor.
I have some Html.Action Code, and would ideally like to convert it to Html.ActionLink as I am thinking of using a security extension function that has been written for ActionLinks.
My code is:
<span class="fa fa-pencil ss-prime ss-cmd" title="Edit Order"></span>
Can this be implemented using an ActionLink?
The "fa fa-pencil" code is a webfont, and I need this.
Thanks in advance

If you use an action link, you may need to modify your styles slightly:
Html.ActionLink("edit order", "Edit", "Order"
, new { id= 1 }
, new { #class="fa fa-pencil" }) // <-- html attributes
This will create an a href, but attach the css styles to the a tag, not the span.
<a class="fa fa-pencil" href="/Order/Edit/1">edit order</a>

Related

Using Bootstrap Component in Action link

How can I use bootstrap icons in #HTML.ActionLink?
When I used this:
#Html.ActionLink("Logout", "Logout", "Admin", new {#class = "glyphicon glyphicon-off" })
It shows this: bootstrap icon, but there is still text.
How do I remove "logout" and just show only the icon?
Unfortunately you cannot pass an empty string as the linkText parameter of the Html.ActionLink helper method.
So write pure HTML to build an anchor tag and set the text as empty. You may use the Url.Action helper method to generate the url to your action method and use the result of that as the href value of the anchor tag.
This should work fine.
Sometimes, it is easy and clean if you create hyperlink manually.
<a href="#Url.Action("Logout", "Admin")">
<span class="glyphicon glyphicon-off" aria-hidden="true"></span>
</a>
You can write a new class to hide anchor texts, this way you can reuse this feature for all anchors by just adding class.
a.hide-text{
line-height: 0;
font-size: 0;
color: transparent;
}
And
#Html.ActionLink("Logout", "Logout", "Admin", new {#class = "hide-text glyphicon glyphicon-off" })

Set image to Html ActionLink

Html.ActionLink("Edit", "ActionResult", new { CustomerId= DataBinder.Eval(c.DataItem, "CustomerId") }, new { target = "_blank" })
How can i make html.actionlink as image (set image)
Any help will be greatly apreciated.
An ActionLink is, pretty much by definition, a link. The Html.ActionLink method you're calling even accepts the text of the link as its first parameter, so you can expect it to be a text link.
But with slightly more manual HTML, you can create an a tag around an img tag using the same target URL. Just use Url.Action instead of Html.ActionLink. Maybe something like this:
<a href="#Url.Action("ActionName", "ControllerName", new { CustomerId= DataBinder.Eval(c.DataItem, "CustomerId") })" target="_blank">
<img src="yourImage.png" alt="Image Text" />
</a>

HTML in MVC RouteLink

I have a RouteLink constructed like so
<p class="articleLink">
#MvcHelper.Html.RouteLink(article.Title, "Article_Route", new RouteValueDictionary() { { "articleId", article.Id }, { "seoUrl", article.SeoUrl } }))
</p>
However, article.Title could potentially contain HTML i.e. the value could be <em>Sample</em> Title which in turn gets rendered like so
<em>Sample</em> Title
Is there any way to prevent the HTML from being escaped, and instead to be treated as actual HTML? Or do I need to create a standard HTML <a href... link in this case (thus losing all the niceties associated with the RouteLink helper).
If you want HTML inside your anchor don't use the Html.RouteLink (because it will HTML encode the link text by default as you noticed) instead of build your a tag by hand with using Url.RouteUrl to generate the url:
<p class="articleLink">
<a href="#(Url.RouteUrl("Article_Route",
new RouteValueDictionary()
{ { "articleId", article.Id },
{ "seoUrl", article.SeoUrl } }))">
#Html.Raw(article.Title)
</a>
</p>
Or you can create your own non encoding RouteLink helper.
You can use HtmlHelper.Raw(). Having said that, it is probably not a good idea to keep any HTML in your model/view model, which is against the principle of separation of model and presentation, also a security hazard.

In ASP.Net MVC how do you generate facebook links?

In ASP.Net MVC, how do you generate the following link?
<a class="facebook" rel="nofollow" target="_blank" href="http://www.facebook.com/sharer.php?u=HTTP://myreallycoolsite.com/somegroup/somechildgroup/some_title/">some_title</a>
The current page is
HTTP://myreallycoolsite.com/somegroup/somechildgroup/some_title/
and it needs to be used as a parameter of the external link.
Here it is in razor:
#{
// you can inline this instead
var Param = Url.Encode(Url.Action("action", "controller", new{ /*params*/ });
^^^^^
// or for the current page's URL (hat tip #Dismissile)
Param = Url.Encode(Request.Url.ToString());
}
<a class="facebook"
rel="nofollow"
target="_blank"
href="http://www.facebook.com/sharer.php?u=#Param">some_title</a>
^^^^^^
If you're not using Razor, it looks like this (or at least close to this):
<%
// you can inline this instead
var Param = Url.Encode(Url.Action("action", "controller", new{ /*params*/ });
^^^^^
// or for the current page's URL (hat tip #Dismissile)
Param = Url.Encode(Request.Url.ToString());
%>
<a class="facebook"
rel="nofollow"
target="_blank"
href="http://www.facebook.com/sharer.php?u=<%=Param%>">some_title</a>
^^^^^^
Create the link as normal and put #Request.Url.ToString() in it. If you need to dynamically put the some_title text in there then you will need to do one of a few different things. If it is part of the route, then you could pull it from RouteData. If it is the title of your page you could probably use ViewBag.Title. If it is completely arbitrary you might just need to use a regex.
<a class="facebook" rel="nofollow" target="_blank" href="http://www.facebook.com/sharer.php?u=#Request.Url.ToString()">some_title</a>
Try this one
<a href="#"
onclick="
window.open(
'https://www.facebook.com/sharer/sharer.php?u='+encodeURIComponent(location.href),
'facebook-share-dialog',
'width=626,height=436');
return false;">
Share on Facebook
</a>

MVC - RouteLink and Image

I'd like this output:
<a href="\Catalog\Flooring">
<img src="http://site.com/dot.jpg" width="100px" height="100px" alt="" />
<span>Some text here</span>
</a>
using a RouteLink similar to:
<%= Html.RouteLink(myFPV.ProductTypeName, "CatalogType", new { controller = "Catalog", action = "Types", group = myFPV.ProductGroupName, type = myFPV.ProductTypeName })%>
I cannot figure out how to add an <img> and <span> (with text) tags inside my <a> tag.
Make sense?
The first parameter of the RouteLink method is for the link text. But unfortunately, it gets encoded automatically, so you cannot send <, > characters to it. (Well, you can. But they'd get encoded.)
Take a look at this page.
Route values are URL encoded automatically. For example, the string “Hello World!” is
encoded to “Hello%20World!”.
Rendering Image Links
Unfortunately, you can’t use the
Html.ActionLink() helper to render an
image link. Because the
Html.ActionLink() helper HTML encodes
its link text automatically, you
cannot pass an tag to this
method and expect the tag to render as
an image.
Instead, you need to use the
Url.Action() helper to generate the
proper link. Here’s how you can
generate a delete link with an image:
<a href="<%= Url.Action("Delete") %>">
<img src="../../Content/Delete.png" alt="Delete" style="border:0px" />
</a>
I suggest use the Url.RouteUrl.
<a href="#Url.RouteUrl("Default", new { action = "Index", controller = "Department", id = 1 })">
<img src="http://site.com/dot.jpg" width="100px" height="100px" alt="" /> </a>
There is a better option to do that. you should try some thing like
<a href="#Url.RouteUrl("index-lang")">
<img src="~/images/logo.png" alt="">
</a>
where the "index-lang" is the route name in route mapping table.

Resources