如何从DatePicker ui jquery中删除时间

时间:2014-10-16 23:27:36

标签: jquery asp.net asp.net-mvc jquery-ui datepicker

我正在使用带有asp.net mvc的jquery ui datepicker,当网页打开时,它会在文本框中显示日期和时间(2014/10/16 00:00:00) datepicker,但是如果我在文本框中为datepicker选择一个日期,它将只显示日期。我不想看时间,有什么不对?

谢谢!

模型中的属性设置如下

[DataType(DataType.Date)]
[Required(ErrorMessageResourceType = typeof(Ressources.Resources), ErrorMessageResourceName="ErrorStartDateRequired")]
[Display(Name = "DateStarted", ResourceType = typeof(Ressources.Resources))]
public DateTime DateStarted { get; set; }

我的日期选择器在我的网页中设置如下:

@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
    });
});

}

这就是控件在网页中的显示方式(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>

4 个答案:

答案 0 :(得分:32)

我终于找到了答案。我添加了#34; {0:d}&#34;在观点方面。

<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>

由于

答案 1 :(得分:0)

将脚本更改为这种方式以避免使用当前日期的时间,避免将var指定为

<script>
        $("#datePickerStartDate").datepicker(
            {
                dateFormat: "yy/mm/dd",
                showOtherMonths: true,
                selectOtherMonths: true,
                showButtonPanel: true,
                changeMonth: true,
                changeYear: true,
                gotoCurrent: true,
            }).datepicker("setDate", new Date());
 </script>

答案 2 :(得分:0)

这就是我使用它的方式。

@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>

答案 3 :(得分:0)

 $("#datePickerStartDate").datepicker({
        dateFormat: 'mm/dd/yy',
        changeMonth: true,
        changeYear: true,
        defaultDate: GetCurrentDate(),
        onSelect: function () {
            $(this).blur().change();
        }
    });