This project is read-only.

Example of DateTimeInput with DateTime?

Apr 15, 2011 at 1:30 PM


Could you please show an example of the using the DateTimeInput with a DateTime?, i.e. a nullable DateTime.
I suppose this can be used to have non-mandatory date inputs, but I cannot figure out how to use it.

Apr 15, 2011 at 8:45 PM
Edited Apr 15, 2011 at 9:40 PM

Hi @Robelind,

In order to handle properly DateTime? and in generale any type that can assume a null value you need to use the technique exposed in Handling optional input and mutually exclusive inputs. There re is no way for the user to "put" a null value into a DateTimeInput, that's why you can' figure out how to do it.... If you use a simple textbox you can use the convention that an empty string represents a null value, however other input types don't give this opportunity. That's why, in the Mvc Controls Toolkit I defined ad hoc tools to handle optional values.  The right way to proceed is to add someway a checkbox(or...something else) to enable the user to specify he don't want to provide a date, so you have to "transform" DateTime? into DateTime+Boolean by usingn an in-line transformation:


                    var hi = Html.TransformedUpdateHelper(m => m.Start, new NullableUpdater<DateTime>());//transformed helper
                    var DTS = hi.DateTimeFor(m => m.Item, DateTime.Now);  //now you have transformed the DateTime? into DateTime +Boolean
                <%:hi.CheckBoxFor(m => m.Chosen) %><%: DTS.Date() %>&nbsp;&nbsp;<%: DTS.Time() %>


For more info about in-line transformations please see :  In-Line Transformations. For more info about how to handle nullable types and, optional and mutually exclusive input see: Handling optional input and mutually exclusive inputs

Another way to proceed is by passing directly the DateTime? to the DateInput  but make the date appears/disappears when pressing a checkbox. The ViewsOnOff, can make input fields appear disappear, by detaching/attaching them from the DOM. In this case you can write: 




<%:Html.ViewsOnOff("startDate", Model.Start.HasValue) %>
                //initially the Date is shown if and only if the DateTime? has a value
                <%var DTS = Html.DateTime("Start", Model.Start);  %>
                <input type='checkbox' class="startDate_checkbox"/>
                <span class="startDate">
                <%: DTS.Date() %>&nbsp;&nbsp;<%: DTS.Time() %>

For a better understanding, please see the documentation of the  ViewsOnOff.

This is the technique I prefer with simple types like the DateTime?, since the in-line transformation of a simple type "detach it" from its original father(a new father is put in between the old father and the child), and consequentely client side validation is not applied(validation attributes are applied on the original father). On the server the temporay father is cancelled so validation is performed normally. For complex types like a whole customer entity the insertion of a "temporary" father doesn't create problems.

Please, doesn't esitate to contact me for more explanations if the documentation is not enough clear, so I can improve the documentation.

Apr 19, 2011 at 6:47 PM

Thanks for the very detailed information.

The second approach suits me the best, since I'm able to have an empty input box for the date.
However, if I input an invalid date in the input box there seems to be no client side validation and on the server
side the model property is null (understandable).
Have I missed something?

Apr 19, 2011 at 11:50 PM

You shoudn't be able to insert an invalid date....actually. The DateInput try to correct all your errors. In the worst case it put the Today date. Maybe you are able to insert an empty textbox, however in this case you should receive the TodayDate...he try always to have a correct date. Doing, say a cut and copy you might put something wrong in the textbox, however, the first time the textbox get focus the error is corrected somaway,....actually the date sonsidered by the system is the one in the Calendar(that can never be wrong)...not the one in the textbox, and on lost focus the two date are aligned.That's why you get no validation error on the client. However, if you put a Range attribute or a DateRange attribute you may constrain the date in that range on the client. That is no error is signalled but also in this case the date is corrected to fit in the required range(read the documentation about the DateRange attribute to see what kind of contraints you can impose). On the client side validation attribute simply cause the date to be "corrected". Validation on the server side may cause validation error messages, since on the server side there is no "custom" validation mechanism. However, they cannot be wrong format errors, but errors caused by some server side validation attribute.

if you get a null date on the server something strange happened, so please give me more information....I am not able to think of any circumstance that might cause this..but the fact that the ViewOnOff is...Off.

Do you get a not null date when there is no error?  

Apr 28, 2011 at 7:58 PM

I tested it like so:

@Html.DateTime("ToDate", Model.ToDate, dateInCalendar : true).DateCalendar(
inLine: false,
calendarOptions : new CalendarOptions
	ShowOn = CalendarOptionsShowOn.button,
	ButtonImage = Url.Content("~/Content/themes/base/images/calendar.gif"),
	ButtonImageOnly = true

If I input a valid date, I get a correct DateTime? at the server side.

Apr 28, 2011 at 9:28 PM

Yes you can do this, but the user has no way of saying he doesn't want to provide a date. If this is ok for your application this is a simpler solution, but on the contrary if you used a DateTime? to give the user the opportunity to avoid entering a date you need to use one of the solution I proposed: with the help of a checkbox that enables/disables the dateitimenput the user has a way to insert a null date. Anyway in the upcoming version I added also the possibility to insert a DateTime? also with DateTimeFor(m=> m.ToDate.............).