I'm working with a jquery ui datepicker with asp.net mvc and when the web page open, it show the date with the time (2014/10/16 00:00:00) in the textbox for the datepicker, but if I select a date in the textbox for the datepicker, it will only show the date. I don't want to see the time, what's wrong?
Thanks!
The property in the model is set like this
[DataType(DataType.Date)]
[Required(ErrorMessageResourceType = typeof(Ressources.Resources), ErrorMessageResourceName="ErrorStartDateRequired")]
[Display(Name = "DateStarted", ResourceType = typeof(Ressources.Resources))]
public DateTime DateStarted { get; set; }
My date picker is set like this in my web page:
@section scripts{
<script language="javascript" type="text/javascript">
$(document).ready(function () {
var anchor = document.getElementById('@Model.Anchor');
anchor.scrollIntoView(true);
var d = new Date(@Model.Project.DateStarted.Year, @Model.Project.DateStarted.Month, @Model.Project.DateStarted.Day);
$("#datePickerStartDate").datepicker({
dateFormat: "yy/mm/dd",
showOtherMonths: true,
selectOtherMonths: true,
showButtonPanel: true,
changeMonth: true,
changeYear: true,
gotoCurrent: true,
defaultDate: d
});
});
}
and this is how the control is showed in the web page (cshtml)
<div class="form-group">
@Html.LabelFor(model => model.Project.DateStarted, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.TextBoxFor(model => model.Project.DateStarted, new { id = "datePickerStartDate" })
@Html.ValidationMessageFor(model => model.Project.DateStarted)
</div>
</div>
$("#datePickerStartDate").datepicker({
dateFormat: 'mm/dd/yy',
changeMonth: true,
changeYear: true,
defaultDate: GetCurrentDate(),
onSelect: function () {
$(this).blur().change();
}
});
I finally found my answer. I added "{0:d}" on the view side.
<div class="form-group">
@Html.LabelFor(model => model.Project.DateFinished, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.TextBoxFor(model => model.Project.DateFinished, "{0:d}", new { id = "datePickerEndDate" })
@Html.ValidationMessageFor(model => model.Project.DateFinished)
</div>
</div>
Thanks
This is how I used it.
@Html.TextBoxFor(a => a.DOB, new { @class = "form-control", placeholder = "Date of Birth", id = "datetimepicker", TextMode = "date", value = "1/11/1989", onkeyup = "return validateChar(this)", maxlength = "20", style = "width:175px;height:25px;" })
<script>
$(document).ready(function () {
$('#datetimepicker').datetimepicker({
lang: 'en',
timepicker: false,
closeOnDateSelect: true,
dateFormat: "yy/mm/dd"
});
});
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With