0

I have the following Razor

<td>@Html.TextBoxFor(m => m.MeetingToEdit.StartTime, new { @class = "datetimepicker form-control", @Value = Model.MeetingToEdit.StartTime })</td>

I access the date from the Controller as

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult UpdateMeetingWithId([Bind(Prefix = "MeetingToEdit")]Meeting model)
    {
        Meeting meeting = meetingsContext.Meetings.Where(a => a.Id == model.Id).First();
        meeting.Title = model.Title;
        meeting.StartTime = model.StartTime;
        meeting.EndTime = model.EndTime;
        meetingsContext.Entry(meeting).State = System.Data.Entity.EntityState.Modified;
        meetingsContext.SaveChanges();
        return RedirectToAction("ReinviteVisitor2", "Home", new { visitorId = model.SubjectId });
    }

So when debugging the chtml, Model.MeetingToEdit.StartTime is correct however when it gets displayed in the textbox in the webpage it is wrong and becomes "Jan 14, 0044 12:00 AM". What is the correct way to ensure the datetime is displayed correctly in the textfield?

EDIT: I am using bootstrap datetimepicker and it is configured as follows:

<script>
$(document).ready(function () {
    $('.datetimepicker').datetimepicker({
        format: 'lll'
    });
});
</script>
rukiman
  • 597
  • 10
  • 32
  • 1
    Never set the `value` attribute when using a `HtmlHelper` method. What is the value of `StartTime` and how do you want it formatted? And you have mentioned a DatePicker - what jquery DatePicker are you using? –  Jul 18 '16 at 06:19
  • OK I took the value attributed off. But now the StartTime and EndTime is empty. I think it is because the format is not correct? – rukiman Jul 18 '16 at 06:39
  • Again, what is the value of `StartTime` and how do you want to display it? –  Jul 18 '16 at 06:41
  • StartTime and EndTime are DateTimes and I want it displayed as 'Mon 18 Jul 2016 4:32 PM' – rukiman Jul 18 '16 at 06:48
  • Then it would be `@Html.TextBoxFor(m => m.MeetingToEdit.StartTime, "{0: ddd dd MMM yyyy h:mm tt}", new { @class = "datetimepicker form-control" })` but you will likely not be able to bind that back to your model when you submit –  Jul 18 '16 at 06:52
  • still getting empty textfield – rukiman Jul 18 '16 at 06:57
  • Then the values of you properties are `null` (or you have an error in attaching the plugin but you still have not shown that) –  Jul 18 '16 at 06:59
  • sorry it is because I didn't copy across the classes as your example..Now it is displaying ok. – rukiman Jul 18 '16 at 07:00
  • However the datepicker doesn't work. Seems like if I remove the "datetimepicker" class the textfield is displayed ok otherwise it is empty. – rukiman Jul 18 '16 at 07:03
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/117572/discussion-between-stephen-muecke-and-rukiman). –  Jul 18 '16 at 07:05
  • See edits in the question for type of datetimepicker – rukiman Jul 18 '16 at 07:36

2 Answers2

0

Explicitly specify the date format, i.e.

@Html.TextBoxFor(m => m.MeetingToEdit.StartTime.ToString("M/d/yyyy"), new { @class = "datetimepicker form-control", @Value = Model.MeetingToEdit.StartTime })

`some other formats u can apply like :

// month/day numbers without/with leading zeroes String.Format("{M/d/yyyy}"); // "3/9/2008" String.Format("{MM/dd/yyyy}"); // "03/09/2008"

// day/month names String.Format("{ddd, MMM d, yyyy}"); // "Sun, Mar 9, 2008" String.Format("{dddd, MMMM d, yyyy}"); // "Sunday, March 9, 2008"

// two/four digit year String.Format("{MM/dd/yy}"); // "03/09/08" String.Format("{MM/dd/yyyy}"); // "03/09/2008" `

Gurpreet Singh
  • 1,641
  • 3
  • 17
  • 29
  • I got an InvalidOperationException for this line @Html.TextBoxFor(m => m.MeetingToEdit.StartTime.ToString("M/d/yyyy"), new { @class = "datetimepicker form-control" }) – rukiman Jul 18 '16 at 06:40
0

Check out this link. Basically you have two options. Either set the DisplayFormat annotation in your view model to define the date format. In that case you'll need to use the EditorFor helper method in your view instead of TextBoxFor.

The second option is to pass the date format into the TextBoxFor helper method. There are examples in the providede link.

Community
  • 1
  • 1
mboldt
  • 1,780
  • 11
  • 15