ASP.NET MVC add css class to actionlink [duplicate] - asp.net-mvc

This question already has answers here:
How do I add a class to an #Html.ActionLink?
(5 answers)
Closed 7 years ago.
How do I add a css class to this actionlink? I have read you do it something like new { class = button } but I'm not sure where to put it within my actionlink:
<%= Html.ActionLink("View Performances", "Details", "Productions",
new { name = item.show , year = item.year }, null) %>

you can try
<%= Html.ActionLink("View Performances", "Details", "Productions",
new { name = item.show , year = item.year },
new {#class = "button"}) %>

Related

How to resolve this asp.net mvc routing issue - removing page (optional) for the first page?

How can I force URL first page without page number?
Here is the exact code I use.
routes.MapRoute("MyPictureQuotes",
"picture-quotes/{PictureQuotesPage}",
new { controller = "Quote", action = "PictureQuotes", PictureQuotesPage = UrlParameter.Optional }
);
<%= Html.RouteLink("Picture Quotes", "MyPictureQuotes", null, new { title = "Picture Quotes", PictureQuotesPage = string.Empty })%>
It returns
"/picture-quotes/5" instead of
"/picture-quotes" from the page
"http://localhost:2489/picture-quotes/5"
It seems the routing value page 5 is carried over.
Does anyone have a solution for this?
You are not using the correct overload of Html.RouteLink. Use the following:
<%= Html.RouteLink("Picture Quotes", "MyPictureQuotes",
new { PictureQuotesPage = string.Empty },
new { title = "Picture Quotes" })%>

MVC webgrid - can you hide a column? [duplicate]

This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
MVC 3 Webgrid - how do you hide columns you do not want to be visible?
I am using a WebGrid in my MVC application. What I want to do is put an if statement inside my form to hide a column depending on the condition. The code below shows what I mean with the if statement, but this is not allowed;
#grid.GetHtml(columns: grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Select", "Details", new { contractId = item.ContractId })),
if(Context.User.IsInRole(ITOF.Web.Models.Role.Inputter)
{
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { contractId = item.ContractId })),
}
grid.Column("SignOffDate", "Sign Off Date",
format:#<text> <span>#item.SignOffDate.ToString("d/M/yyyy")</span></text>),
grid.Column("FullContractNumber", "Contract Number"),
grid.Column("ContractTitle", "Title")
));
I don't know if this works, because I don't know the inner workings of the helper. You probably could do something like this:
#{
var temp = grid.GetHtml(....);
if(Context.User.IsInRole(ITOF.Web.Models.Role.Inputter)
{
temp.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { contractId = item.ContractId })),
}
}
#Html.Raw(temp);
The helper should return an grid object not a string, otherwise you can't add the columns anymore.

Define a Template column for Telerik MVC Grid in Razor syntax

I have the following legacy code that I would like to mimic, with all action links inside one column. However, I can't seem to get the Razor syntax right. How should I express this in Razor?
The ASPX column template is like this:
.Columns(column =>
{
column.Template(o =>
{%>
<%= Html.ActionLink("Edit", "Edit", new{ id = o.DeviceID}) %> |
<%= Html.ActionLink("Delete", "Delete", new { id = o.DeviceID })%>
<%});
I have only been able to get three separate columns using Razor without complaints about syntax etc. as below:
.Columns(columns =>
{
columns.Template(o => #Html.ActionLink("Edit", "Edit", new { id = o.ProductId })).Width(50);
columns.Template(o => #Html.ActionLink("Details", "Details", new { id = o.ProductId })).Width(50);
columns.Template(o => #Html.ActionLink("Delete", "Delete", new { id = o.ProductId })).Width(50);
How can I define one template column that contains all three action links using Razor syntax?
EDIT: In trying the following small adaptation of Mike's answer below, I get the error "Only assignment, call, increment, decrement, and new object expressions can be used as a statement":
columns.Template(o => #<text>#Html.ActionLink("Edit", "Edit", new { id = o.CampaignId }) |
#Html.ActionLink("Delete", "Delete", new { id = o.CampaignId })
</text>).Width(100);
Here is a quick sample showing both bound columns and a template column:
Sample #1 using #<text></text> syntax
#(Html.Telerik().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(m => m.UserName);
columns.Bound(m => m.Email);
columns.Template(#<text> #Html.ActionLink("Edit", "Edit", new { id = item.UserId} ) |
#Html.ActionLink("Delete", "Delete", new { id = item.UserId)
</text>).Width(100);
})
)
Sample #2 using an Action delegate
#(Html.Telerik().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(m => m.UserName);
columns.Bound(m => m.Email);
columns.Template(m => #Html.ActionLink("Edit", "Edit", new { id = m.UserId} ) + " | " +
#Html.ActionLink("Delete", "Delete", new { id = m.UserId)
).Width(100);
})
)
Hope that helps, if didn't already figure it out. :)
UPDATE - added the implicitly defined "item" parameter in code sample above. It shows how to get the Model properties within the Telerik control template.
UPDATE#2 - korchev showed the "#item.someProperty" syntax within his code sample. The # symbol is not needed in our case since we are within an extension method, but doesn't hurt to leave it for clarity.
UPDATE#3 - added Sample #2 code sample
If you are binding with ajax, the format has to look something more like this:
c.Bound(i => i.Name).ClientTemplate(#Html.ActionLink("<#= Name #>", "[Action]", "[Controller]", new { Id = "<#= Id #>" }, new { Area = "[Area]" }).ToHtmlString())
See here for more info: http://www.telerik.com/forums/kendo-mvc-grid-actionlink-column
columns.Template(#Html.ActionLink("Edit", "Edit", new {id = #item.id }));
Check ScottGu's blog posts with regard to Razor for what #item is.
columns.Command(commands => {
commands.Custom("Update").Text(Resource.Edit)
.ButtonType(GridButtonType.BareImage) .SendState(true).SendDataKeys(true).HtmlAttributes(new { id = "popUp"})
Action("Gallery_Bar_EditOrAddTranslate", "Administration").Ajax(false);
commands.Custom("Update").Text(Resource.Edit)
.ButtonType(GridButtonType.BareImage) .SendState(true).SendDataKeys(true).HtmlAttributes(new { id = "popUp"}) Action("Gallery_Bar_EditOrAddTranslate", "Administration").Ajax(false); }).Width("5%").Title(Resource.Coomand);
This will generate something like action Link
the id id = m.UserId you can show like DataKeys:
.Name("GridName") .DataKeys(key =>
{
key.Add(c => c.UserId).RouteKey("userId");
})
at the post method you will have :
public ActionResult xxx(int userId)
{
}
I had a print button I needed to put in the Header row, that I chose to put in the same column as, but above where the Update button goes. I was able to do it just fine in Razor like this:
columns.Command(command => {command.Edit(); }).Width(100).HeaderTemplate(i => #Html.ActionLink("Print Grid", "OutputAgencies", "Admin", new { #class = "k-button" }) );
This is where "Print Grid" was for display on my linkbutton, "OutputAgencies" was a method in my controller, and "AdminController" was the name of my controller.

Generate links in ASP.NET MVC?

I have the following route definition in a MapRoute Table:
routes.MapRoute(
"ViewDocument",
"browse/document/{document_id}/{document_title}",
new { controller = "Document", action = "ViewDocument"}
);
I have to create links of documents on document index view (document object have "id" and "title" property)
What should be my approach to generating the link in ASP.NET MVC?
Is there anything I am doing wrong with the route definition?
In your routes:
routes.MapRoute(
"ViewDocument",
"browse/document/{document_id}/{document_title}",
new { controller = "Document", action = "Title", document_id = "", document_title = ""}
);
In your View:
<%= Url.RouteUrl("ViewDocument", new { document_id = ... , document_title = ... }) %>
(renders plain url)
or
<%= Html.RouteLink("ViewDocument", new { document_id = ... , document_title = ... }) %>
(renders <a></a> element with href attribure filled with the url)
Won't you be able to find the proper Document simply based off its ID?
Won't the Title be redundant?
You can generate links to documents for the route given with the following:
<%= Html.ActionLink("Doc Link", "Title", "Document", new { document_id="id", document_title="title" }, null) %>
A couple of things to be aware of:
Your custom route must be added before the Default route.
You have to include the route values as shown above in order to have them specified in the link.

Setting maxlength and other html attributes using ASP.NET MVC helper methods

Currently when I want to set html attributes like maxlength and autocomplete, I have to use the following syntax:
<%= Html.TextBox("username", ViewData["username"], new { maxlength = 20, autocomplete = "off" }) %>
Is there any way to do this without having to explicitly set the ViewData["username"] portion? In other words, I want to rely on the helper method's automatic loading routine rather than having to explicitly tell it which field to load up from the ViewData.
Just pass "null" as second parameter:
<%= Html.TextBox("username", null, new { maxlength = 20, autocomplete = "off" }) %>
yes but you have to use ViewData.Model instead of ViewData.Item()
the code in your controller should look like this (sry 4 VB.NET code)
Function Index()
ViewData("Title") = "Home Page"
ViewData("Message") = "Welcome to ASP.NET MVC!"
Dim user As New User
Return View(user)
End Function
now you can do this in the view
<%=Html.TextBox("username", Nothing, New With {.maxlength = 30})%>
note that the user object has a public property username
hth
I used construction as below:
<%= Html.TextBox("username", "", new { #maxlength = "20", #autocomplete = "off" }) %>
For Setting max length of TextBox you can pass "" or null for Second Parameter and set html attributes(maxlength) as third parameter
<%=Html.TextBox("username", "", new { #maxlength = 10 }) %>

Resources