HTML and CSS Reference
In-Depth Information
value = viewData.TemplateInfo.FormattedModelValue.ToString();
if (string.IsNullOrWhiteSpace(value))
valueAttribute = string.Empty;
valueAttribute = "value=\"" + value + "\"";
// Determine the css class
string css = "range";
ModelState state;
if (viewData.ModelState.TryGetValue(name, out state)
&& (state.Errors.Count > 0))
css += " " + HtmlHelper.ValidationInputCssClassName;
// Format the final HTML
string markup = string.Format(Culture,
"<input type=\"range\" id=\"{0}\" name=\"{1}\" " +
"min=\"{2}\" max=\"{3}\" step=\"{4}\" {5} class=\"{6}\"/>",
id, name, min.ToString(), max.ToString(), step.ToString(),
valueAttribute, css);
return MvcHtmlString.Create(markup);
Adding the Range Template
Now you'll need to create an editor template for the range control that will use this new custom method.
eXerCISe 3-6. aDDING a raNGe teMpLate
Right-click the Views\shared\EditorTemplates folder and select the Add ➤ View links.
in the Add View dialog box, enter the name Range and unselect all of the text boxes.
Replace the default implementation with the following:
@Html.Html5().RangeControl(0, 200, 20)
open the FeedbackModel.cs file and add the UIHint attribute to the Satisfaction
property like this:
[Display(Name = "Overall Satisfaction"), UIHint("Range") ]
public string Satisfaction { get; set; }
While you have the FeedbackModel.cs file open, add a UIHint attribute for the
Score property as follows:
[Display(Name = "Average Score", Prompt = "Your average score"),
Range(1.0, 100.0), UIHint("Number"),
public decimal Score { get; set; }
Search WWH ::

Custom Search