DropDown List
As usual you could start by defining a view model:
public class YearsViewModel
{
public string Year { get; set; }
public IEnumerable<SelectListItem> Years
{
get
{
return new SelectList(
Enumerable.Range(1900, 112)
.OrderByDescending(year => year)
.Select(year => new SelectListItem
{
Value = year.ToString(),
Text = year.ToString()
}
), "Value", "Text");
}
}
}
Then a controller:
public class YearsController : Controller
{
public ActionResult Index()
{
return View(new YearsViewModel());
}
[HttpPost]
public ActionResult Index(int year)
{
// TODO: do something with the selected year
return new EmptyResult();
}
}
and a corresponding view for the index action:
@model SomeAppName.Models.YearsViewModel
@{
Layout = null;
}
@Html.DropDownListFor(x => x.Year, Model.Years)
And finally inside your _Layout.cshtml you could use this controller:
<div id="selectyear">@Html.Action("index", "years")</div>
and attach a corresponding script which would send an AJAX request when the value changes:
$(function () {
$('#selectyear select').change(function () {
$.post('@Url.Action("index", "years")', { year: $(this).val() }, function (result) {
});
});
});
Check Box
@Html.CheckBox("ChxName",true)
and I got the following result;
<input checked="checked" id="ChxName" name="ChxName" type="checkbox" value="true" />
<input name="ChxName" type="hidden" value="false" />
Image
| |
You can create an extension method for HtmlHelper to simplify the code in your CSHTML file. You could replace your tags with a method like this:
// Sample usage in CSHTML
@Html.ActionImage("Edit", new { id = MyId }, "~/Content/Images/Image.bmp", "Edit")
Here is a sample extension method for the code above:
// Extension method
public static MvcHtmlString ActionImage(this HtmlHelper html, string action, object routeValues, string imagePath, string alt)
{
var url = new UrlHelper(html.ViewContext.RequestContext);
// build the <img> tag
var imgBuilder = new TagBuilder("img");
imgBuilder.MergeAttribute("src", url.Content(imagePath));
imgBuilder.MergeAttribute("alt", alt);
string imgHtml = imgBuilder.ToString(TagRenderMode.SelfClosing);
// build the <a> tag
var anchorBuilder = new TagBuilder("a");
anchorBuilder.MergeAttribute("href", url.Action(action, routeValues));
anchorBuilder.InnerHtml = imgHtml; // include the <img> tag inside
string anchorHtml = anchorBuilder.ToString(TagRenderMode.Normal);
return MvcHtmlString.Create(anchorHtml);
}
|
File Upload
There isn't an html helper for file inputs, but what is wrong with just doing
@using (Html.BeginForm("Action", "Controller", FormMethod.Post, new {enctype = "multipart/form-data"})) {
<input type='file' name='blah' id='blah' />
}