Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

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 
share|improve this question
    
Duplicate stackoverflow.com/questions/1328025/… –  David Mar 29 '13 at 18:04
    
Tried those solutions without any luck. See edits. –  NealR Mar 29 '13 at 19:36

2 Answers 2

up vote 2 down vote accepted

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" })
share|improve this answer

Edit: MVC4 users can use this

You want this overload

@Html.TextBoxFor(m => m.DateTaken, "{0:MM/dd/yyyy}", new { id="dtkn" })

If you're willing to give up on the helper just to it manually

<input type="text" value="@Model.DateTaken.ToString("MM/dd/yyyy")" id="dtkn" />
share|improve this answer
    
I get the error No overload for method 'TextBoxFor' takes 3 arguments –  NealR Mar 29 '13 at 19:53
    
Sorry, missed MVC3. Try stackoverflow.com/questions/5972536/… –  Jasen Mar 29 '13 at 19:55
    
The <input type route allows the date to be loaded properly. However, since this is an edit page, it essentially send a blank value (1/1/00001) back to the controller. –  NealR Mar 29 '13 at 20:37

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.