Label with extra attributes using ASP.NET HTML Helpers - html

I would like to know if it's possible to generate the label tag below using HTML Helpers:
<label class="myClass" attr1="attr1Value" attr2="attr2Value" attr3="attr3Value">labelText</label>
It's basically a standard label tag having 3 extra attributes.

You can use the htmlAttributes parameter of #Html.Label or #Html.LabelFor
#Html.Label("YourLabel", new { attr1 = "attr1Value", attr2 = "attr2Value" })
When using class or other reserved words use at #
#Html.Label("YourLabel", new { #class = "classname" })
When using attributes with dashes -, such as data attributes, use underscores _ which end up being converted to dashes -
#Html.Label("YourLabel", new { data_url = "myurl" })
However, I think support for htmlAttributes in Html.Label and
Html.LabelFor was only added in MVC4, for earlier versions of MVC
you can write your own extension method.
How to extend MVC3 Label and LabelFor HTML helpers?

Using the HtmlHelper its possible to add custom attributes to any Element.
#Html.Label("Content", new { attr1= "attr1" })
but you need to add # to attributes that are keywords e.g. class

Related

how do add css-classname to the whitelist?

I have a string with html tags:
html = '</span class="repository-content"> ... </span>'
I need to allow a only specific name for the css class. I use gem sanitize.
This code works well and allows any name for the css class:
Sanitize.fragment(
html,
elements: ['span'],
attributes: { 'span' => ['class'] }
)
But need to allow only the class repository-content. Any other class name must not pass.
How can this be done? any proposal
If instead of inputting html, you input the ... part and build the span like this:
content_tag(:span, ..., class: "repository-content")
then you can write ruby to handle the logic of what to do if the class is not "repository-content".
You may have to sanitize the ..., but you probably won't have to sanitize the output of content_tag.

Issues binding #Html.LabelFor and #Html.DropDownListFor MVC5

I have a #Html.DropDownListFor for my form-control that has multiple countries to choose from in a drop down menu. I need this form-control to be ADA compliant, so I need to have a label associated with it. This is the form-control:
#Html.DropDownListFor(x => x.ShippingCountry, Model.Countries, "Please select a country",
new
{
#id = "ShippingCountry",
#name = "ShippingCountry",
#class = "w100",
#title = "Shipping Countries"
})
Using something like #Html.labelFor("ShippingCountry") or #Html.LabelFor(m => m.ShippingCountry) does not pass the ADA compliance tests according to the Web Accessibility Evaluation Tool (WAVE).
Is there a specific way to bind labels and form controls such as DropDownListFor in MVC5 using Razor code? Thanks for any help in advance!

Using data-number-to-fixed as additionalViewData on Html.EditorFor

I want to use this properties data-number-to-fixed and data-number-stepfactor on my Html.EditorFor control but it does not allow me to do that. Currently the Editor for looks like this
#Html.EditorFor(model => model.CreditCardFees, new { htmlAttributes = new { #class = "form-control text-right", #step = "0.01", #type = "number" } })
But when I add those 2 attributes Visual Studio's Intellisense complains like such
and when I run it will show compiler error
Compiler Error Message: CS1525: Invalid expression term 'fixed'
Any ideas how do I use these 2 attributes?
Looks like I found an answer, just use _ "underscore" in replacement of the - "dashes", MVC will convert it to dashes on compile time.

How to set label value on Razor Html.DropDownList

i want to set the label value for a dropdownlist(not the default value, the label value) and i think im doing something wrong
#Html.DropDownList("cboCategoria", new SelectList(Model, "ID", "Nome"), new { #id = "cboCategoria", #label = "Categoria-pai: " })
You can do it a few ways, The label is seperate from the creation of the actual <select>:
<label>Categoria-pai: #Html.DropDownList(...)</label>
OR
<label for="cboCategoria">Categoria-pai:</label> #Html.DropDownList(...)
OR
#* This assumes you are creating the dropdown from a property named
cboCategoria in your Model *#
#Html.LabelFor(m => m.cboCategoria) #Html.DropDownList(...)
EDIT: I did want to note, that if you use the last method, you will want a [Display] attribute on your Model's property.

(Razor) String length in Html.Helper?

This is a very simple question.
I have a Html.helper:
#Html.DisplayFor(modelItem => item.Text)
How to I cut down the string from item.Text to a specific length? I wish you could do a SubString or something directly on the item.Text.
If youre wondering why I want this, its because the strings are very long, and I only want to show a bit of it in like the index view etc.
I needed the same thing and solved the case with the following lines.
<td>
#{
string Explanation = item.Explanation;
if (Explanation.Length > 10)
{
Explanation = Explanation.Substring(0, 10);
}
}
#Explanation
</td>
If your string is always larger than 10, you can rule out:
if (Explanation.Length > 10)
{
Explanation = Explanation.Substring(0, 10);
}
And directly write:
string Explanation = item.Explanation.Substring(0, 10);
Also I recommend adding .. for strings larger than the limit you give.
There are 3 possibilities that could be considered:
Strip the text in your mapping layer before sending it to the view (when converting your domain model to a view model)
Write a custom HTML helper
Write a custom display template for the given type and then 3 possibilities to indicate the correct display template: 1) rely on conventions (nothing to do in this case, the template will be automatically picked) 2) decorate your view model property with the UIHint attribute 3) pass the template name as second argument to the DisplayFor helper.
You could just add a property onto your view model that does the truncation of the string and display that instead:
// View model
public string TextShort { get { return Text.Substring(0, 10); } }
// View
#Html.DisplayFor(modelItem => item.TextShort)
Change
#Html.DisplayFor(modelItem => item.Text)
to
#Html.Display(item.Text.Length > 10 ? item.Text.Substring(0,10) : item.Text)
Edited : New Answer
what about
#{
modelItem.ShortText= model.Text.Substring(0, ....);
}
#Html.DisplayFor(modelItem => item.ShortText)
The prototype for DisplayFor is :
public static MvcHtmlString DisplayFor<TModel, TValue>(
this HtmlHelper<TModel> html,
Expression<Func<TModel, TValue>> expression
)
And the modelItem is a dynamic I think, so it should be possible to add anew property to the view model.