I'm starting to learn ASP.NET MVC, and have a problem, how generate code with Html.ActionLink like this:
<a href="~/Views/Home/Create.cshtml" class="btn btn-primary">
<i class="icon-pencil icon-white"></i>
<span>
<strong>Create</strong>
</span>
</a>
please.
Html.ActionLink() only supports plain-text links.
You should use <a href="#Url.Action(...)"> for more-complex links.
I wanted to add to SLaks answer.
Using <a href="#Url.Action(...)"> with what user2567619 wanted.
<a href="#Url.Action("Create", "Home")" class="btn btn-primary">
<i class="icon-pencil icon-white"></i>
<span>
<strong>Create</strong>
</span>
</a>
I think it's worth mentioning that #Url.Action can take it's parameters like this:
#Url.Action(string actionName, string controllerName)
Whereas #Html.ActionLink can take it's parameters like this:
#Html.ActionLink(string linkText, string actionName, string controllerName)
It may be pretty obvious, but I thought it was worth noting.
Edit
As Peck_conyon noted, for both #Url.Action and #Html.ActionLink, these are just one of the ten different overload methods.
For documentation on UrlHelper.Action, look here.
For documentation on LinkEtensions.ActionLink, look here.
Simple as this:
#Html.ActionLink("Title", "Action", null, new {#class="btn btn-info fa fa-pencil" })
#Html.ActionLink("Edit","Edit","",new { #class= "btn btn-primary" })
Result
If it's in the Layout page, you can use this, I think it may help:
<li>#Html.ActionLink(" Login", "Index", new { Controller = "Login", Area = "Security" }, new { #class = "glyphicon glyphicon-log-in" })</li>
or like this for a action_link:
<p>
#Html.ActionLink(" Create New", "Add", "Event", FormMethod.Post, new { #class = "glyphicon glyphicon-plus" })</p>
Hope this helps.
This example may help you.
#Html.ActionLink(" ", "Controller", new { id = item.Id }, new { #class = "btn
btn-success btn-circle fa fa-plus-circle", title = "Confirm" })
this way you will have an icon without the text.
You can simply put like this:
take the help of google icons. just paste the style tag and libraries into your template like this:
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Roun**strong text**ded:opsz,wght,FILL,GRAD#48,400,0,0" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD#20..48,100..700,0..1,-50..200" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Kdam+Thmor+Pro&display=swap" rel="stylesheet">
<style>
.material-symbols-rounded {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48
}
</style>
use the above libraries like this:
Edit
#Html.ActionLink("Add Stock", "Create", null, new { #class = " fa fa-plus link-dark rounded " })
Add Stock is String Link Text
Create String Action Name
null Object routevalues
new { #class = " fa fa-plus link-dark rounded " } is Object html Attributes
Related
I have html code which is posted below. I would like to apply that Delete and Edit Button class to HTML Action Link.
Here is my code.
#Html.ActionLink("Edit", "EditUser", new { UserName = item.UserName }) |
#if ((item.UserName.ToLower() != this.User.Identity.Name.ToLower()))
{
#Html.ActionLink("Delete", "DeleteUser", new { UserName = item.UserName },
new { onclick = "return confirm('Are you sure you wish to delete this user?');" })
}
This HTML Code for Delete and Edit:
<a href="#" class="btn btn-info btn-xs black">
<i class="fa fa-trash-o"></i> Delete
</a>
<a href="#" class="btn btn-success btn-xs purple">
<i class="fa fa-edit"></i> Edit
</a>
How can I make it work?
Help would be appreciated.
You have to use the # character, since class is a keyword in C#. Here's a link to the MSDN documentation: http://msdn.microsoft.com/en-us/library/dd492124(v=vs.108).aspx
#Html.ActionLink("<i class='fa fa-trash-o'></i> Delete", "DeleteUser",
new { UserName = item.UserName },
new { #class = "btn btn-info btn-xs black" })
I am working on the asp.net mvc project. I am generating a name with this code -
#Html.LabelFor(x => x.ReturnAirTemperature, new { style = "position: absolute;top: 310px;left: 18px;z-index: 10000;font-weight:bold" })
I have this model for it -
[Display(Name = "T(return)")]
public decimal ReturnAirTemperature { get; set; }
How can I create a link on "T(return)" text ?
You can also do something like this
<a class="" href="#Url.Action("ActionName","ControllerName", new { id=item.MyID })">
<i class="glyphicon glyphicon-pencil"></i>
<span class="sr-only">#Html.LabelFor()</span>
</a>
I suggest you to use like this:
<label for="#nameof(Model.ReturnAirTemperature )">u must agree our terms and conditions</label>
How can I include html entities in ActionLink. e.g. The case of » below.
<p>#Html.ActionLink("Link Text »", "Index", new { }, new { #class = "btn btn-warning", #role = "button" })</p>
Use Url.Action instead
<p><span class="btn btn-warning">Link Text »</span></p>
I have got:
<p><a class="btn btn-default" href="~/Person">List of Cients »</a></p>
I would like to replace it with HTML Action Link but don't change visual style.
I want to get to Index Action of PersonController:
public class PersonController : Controller
{
private PersonContext db = new PersonContext();
// GET: Person
public ActionResult Index()
{
return View(db.Persons.ToList());
}
}
How the #Html.ActionLink(...) should look like.
EDIT:
I tried:
<p><a class="btn btn-default" href="~/Person">List of Cients »</a></p>
#Html.ActionLink("List of Clients »", "Index", "Person", new { #class = "btn btn-default" })
There is the problem with: » ActionLink does not renders preetty arrow.
EDIT2:
Tried this with no result: #Html.ActionLink("List of Clients " + HttpUtility.HtmlDecode("»"), "Index", "Person", new { #class = "btn btn-default" })
EDIT:
Both don't work.
<p> #Html.ActionLink("List of Clients »", "Index", "Person", new { #class = "btn btn-default" })</p>
<p> #(Html.ActionLink("List of Clients »", "PersonController/Index", new { #class = "btn btn-default" }));
First gives right style but when I click I get length=6 in the link.
Second does not have style and links to: http://localhost:17697/Home/PersonController/Index?class=btn%20btn-default
ANSWER: This one works:
<p> #Html.ActionLink("List of Clients »", "Index", "Person", null, new { #class = "btn btn-default" })</p>
#(Html.ActionLink("Title", "/PersonController/Index", new { #class = "myCssClass" }));
Here's a link for reference: http://msdn.microsoft.com/en-us/library/dd492124(v=vs.108).aspx
Please try this, it will work
<a href="#Url.Action("Index", "Person")">
<button class="btn btn-default">
List of Cients »
</button>
</a>
try this
#Html.ActionLink("ButtonText", "Action","Controller", new {#class="btn btn-default"})
it's what worked for me.
NB. the new {#class="btn btn-default"} goes after the 3rd comma.
<pre>
<p>I will display »</p>
<div>
#Ajax.ActionLink("Contact " + HttpUtility.HtmlDecode("»"),
"_PartialEmployeeIndex", "Employee",
new AjaxOptions() { UpdateTargetId = "divToUpdate" },
new { #class = "btn btn-primary" })
</div>
</pre>
I have this code:
<button type="submit" name="submit" class="btn green pull-right">
Potvrdi <i class="m-icon-swapright m-icon-white"></i>
</button>
How can I make Zend_Form_Element_Button with these attributes? (including tag, it is an icon that goes with the text "Potvrdi" as label on button)
I have done this so far:
$submit = new Zend_Form_Element_Button('submit');
$submit ->setLabel('Potvrdi')
->setAttrib('type', 'submit')
->setAttrib('class', 'btn green pull-right');
Thank you.
The quickest solution is to disable escaping for the label and include the HTML code directly in the label:
$submit = new Zend_Form_Element_Button('submit');
$submit ->setLabel('Potvrdi <i class="m-icon-swapright m-icon-white"></i>')
->setAttrib('type', 'submit')
->setAttrib('class', 'btn green pull-right')
->setAttrib('escape', false);
However, If you plan to use this type of button often in your source code, you should consider writing your own Zend_Form_Element (e.g. My_Form_Element_IconButton) that takes care of adding these tags.