Html5 inputs and fallback
Asp.net core Mvc Controls Toolkit enhances the input tag helper to select the right Html5 input type
based on the .Net type and a possible property DataTypeAttribute.
Below the mapping:
-
All numeric types map to the
numberinput type. If you need a typerangespecify the input type explicitely to override the automatic selection. See live number and range -
DateTime maps to
dateif the property has aDate,DataTypeAttributeotherwise todatetime-local. See live date and datetime-local. Important: when adatetime-localis bound to aDateTimeOffsetinstead of a simpleDateTime, once in the browser time is converted and shown automatically in the client time zone. -
TimeSpan with
Time,DataTypeAttributemaps totime. See live time -
string always maps to
text, but when there is aColor,DataTypeAttributein which case it maps tocolor. See live color -
Week structure maps to
week. See live week -
Month structure maps to
month. See live month
Default installation adds the bootstrap-html5-fallback JavaScript package that automatically provides
fallback widgets when an Html5 input is not available. Usage of widgets may be forced by setting the property with the name
of the Html5 type to true in the options object in wwwroot/startupjs/startup.js:
options.browserSupport = {
cookie: "_browser_basic_capabilities",
forms: null,
fallbacks: {
number: {
force: true
},
range: {
force: false
},
time: {
force: true
},
date: {
force: true
},
....
...
The right format of all .net types is automatically checked on the client side by the jquery-validation-unobtrusive-extensions module. Please refer to the input validation section for more infos on how to customize and localize all error messages.