ASP.NET MVC3: Displaying Date in correct format with JQuery DatePicker and editorFor/TextBoxFor

Question

In my model I have:

    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd/MM/yyyy}")]
    public DateTime StartDate { get; set; }

Unfortunately, It only applies to EditorFor, but I cant assign the EditorFor a class, to enable Jquery Datetime picker, as there is no htmlAttributes parameter.

@Html.EditorFor(model => model.StartDate)
@Html.TextBoxFor(model => model.StartDate, new { @class = "datePicker", @readonly = "readonly" })

So the first shows only the date, but has no datepicker. The second shows the time too 00:00 but has a datetimepicker.

Note: Dont just say, use model.StartDate.ToString("mm/DD/yyyy"). It does not work.

How Can I set just the Date. But have a timepicker for it And have readonly, so I cant type any numbers in it.

I'm interested in an MVC level solution to this. I ended up resorting to standard html input elements to achieve this effect in my own project. — Joel Etherton, Commented Feb 8, 2012 at 15:32

Amalea · Accepted Answer · 2012-02-08 15:55:43Z

2

I'm using the jquery UI datepicker, which rather than append a class tag, I set the default date format via:

    $(function () {
        $.datepicker.setDefaults({
            dateFormat: 'dd/mm/yy'
        });
    });

Then to bind it to the input element:

    $(function () {
        $("#StartDate").datepicker();
    });

Hope that helps. And thats on the EditorFor mvc tag.

answered Feb 8, 2012 at 15:55

Amalea

5261 gold badge6 silver badges17 bronze badges

Thanks, Yea assigning it via fieldname seems to be the only way, as you cant seem to set htmlattributes aka classes. And using my displaycode, it can then apply the format of the model, and use the datetimepicker via this. Still cant set readonly though. My Time picker is another problem. Ive overcome this with @Html.TextBoxFor(model => model.EndTime, new {@Value = Model.EndTime.ToString().Substring(0,5), @class = "timePicker", @readonly = "readonly" }). Madness
– IAmGroot
Commented Feb 8, 2012 at 16:17

Add a comment |

Collectives™ on Stack Overflow

ASP.NET MVC3: Displaying Date in correct format with JQuery DatePicker and editorFor/TextBoxFor

1 Answer 1

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Related