My View Model:
public partial class FileTransferFilterCriteriaViewModel
{
public string Fice { get; set; }
public string SourceEmail { get; set; }
public string TargetEmail { get; set; }
public DateTime FromDate { get; set; }
public DateTime ToDate { get; set; }
public string Status { get; set; }
public string Category { get; set; }
}
(Nothing is coming from the DB.)
My Controller:
return View(new FileTransferFilterCriteriaViewModel())
Here is what gets displayed for both FromDate
and ToDate
:
1/1/0001 12:00:00 AM
My HTML:
@Html.TextBoxFor(x =>x.Criteria.FromDate)
Questions:
- If the date is
null
, how can I suppress the display of the default date value?
- If the date is not
null
, how can I format the date as MM/dd/yyyy
?
Use nullable date in your ViewModel:
public DateTime? FromDate { get; set; }
I have created an editor template and this is working for me.
Changes to view model:
[UIHint(UiHintConstants.DateCalendar)]
public DateTime? FromDate { get; set; }
[UIHint(UiHintConstants.DateCalendar)]
public DateTime? ToDate { get; set; }
After that, created an editor template in Views/Shared/EditorTemplate folder called DateCalendar.chtml:
@using System.Globalization
@model DateTime?
@Html.TextBox("", (Model.HasValue && !Model.Value.ToString(CultureInfo.InvariantCulture).Contains("1900") && !Model.Value.ToString(CultureInfo.InvariantCulture).Contains("0001") ? Model.Value.ToString("MM/dd/yyyy") : string.Empty), new { @class = "datePicker", maxlength = "12", size = "12" })
and then utilized it as:
@Html.EditorFor(x =>x.FromDate)
@Html.EditorFor(x => x.ToDate)
and here is the source code:
<input class="datePicker" id="Criteria_FromDate" maxlength="12" name="Criteria.FromDate" size="12" type="text" value="" />
<input class="datePicker" id="Criteria_ToDate" maxlength="12" name="Criteria.ToDate" size="12" type="text" value="" />
Hope this helps some one else.
I couldn't figure out one part though, moving the size and maxlenth out of the template. In this case it is not relevant but may become in some other instances like where i may lock the text box or don't want the jquery calendar. I'll post as soon as i have a handle on this.
Everything is working perfectly. You are not fetching any data from the database though (as evidenced by passing in a newly instantiated view model return View(new FileTransferFilterCriteriaViewModel())
). You should consider doing that inside of your controller's action method. To get a shorter date format, use @Html.TextBoxFor(x =>x.Criteria.FromDate.ToShortDateString())