Remove time from ASP MVC @Html.TextBoxFor Control using jQuery datepicker

Question

How do I prevent the time from showing up when using the jQuery

.datepicker()

? Below is the section of the model for the two attributes (date taken and expiration date)

    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:d}")]

    [DisplayName("Expiration Date")]

    public string ExpirationDate { get; set; }



    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:d}")]

    [DisplayName("Date Taken")]

    public string DateTaken { get; set; }

This works fine using the

@Html.EditorFor

control on the view I'm working on. However, when I change that control from this:

 @Html.EditorFor(model => model.DateTaken)

to this:

@Html.TextBoxFor(m => m.DateTaken, new { id = "dtkn" })

in order to get this to work (label which control has the

datepicker

applied to it):

<script>

    $(function () {

        $("#dtkn").datepicker('setDate');

        $("#exp").datepicker('setDate');

    });



    $.datepicker.setDefaults({

        buttonImageOnly: true,

        buttonImage: '<%=Url.Content("~/Content/images/magnify.gif") %>',

        defaultDate: -1,

        gotoCurrent: true,

        prevText: "<< Prev",

        nextText: "Next >>"

    });

</script>

suddenly the time begins to show up. Any suggestions?

EDIT

I have tried the following formats and none will work:

$("#dtkn").datepicker({ dateFormat: 'dd-mm-yy' }).val();

$("#dtkn").datepicker({ dateFormat: 'yy-mm-dd' });

$("#dtkn").datepicker('getDate').format('yyyyMMdd');

and this:

$("#dtkn").datepicker('getDate').datepicker('dd/mm/yy');

$('#dtkn').datepicker('option', { dateFormat: 'd MM y' });

Here is the error I'm seeing the Chrome debugging console:

Uncaught TypeError: Cannot call method 'datepicker' of null

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

By using @Html.TextBox as opposed to @Html.TextBoxFor I was able to find an overload that works.

@Html.TextBox("DateTaken", Model.DateTaken.ToString("MM/dd/yyyy"), new { id = "dtkn" })

Remove time from ASP MVC @Html.TextBoxFor Control using jQuery datepicker

Sign up