Привязать значение Datetime Model к datepicker и передать их методу контроллера

Question

Привязать значение Datetime Model к datepicker и передать их методу контроллера

0

Я создаю приложение MVC4, и в моей модели у меня есть следующие поля:

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

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

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

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

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

Я пытаюсь установить datepickers в представлении. Вот что я сделал до сих пор:

<div class="float-left">
    <p>Date Created:</p>
    <p>Date of last modification:</p>
    <p>Date Last Displayed:</p>
    <p>Date of promotion start:</p>
    <p>Date of promotion end:</p>
</div>
<div class="float-right">
    <p>
        @Html.TextBoxFor(_item => _item.mCardOfTheDay.mDateCreated, new
            {
                @value = Model.mCardOfTheDay.mDateCreated,
                @selectedDate = Model.mCardOfTheDay.mDateCreated,
                @class = "datePick",
                @type = "date",
                @id = "dateCreated"
            })
    </p>
    <p>
        @(Model.mCardOfTheDay.mDateModified != null ? Html.DisplayFor(_item => _item.mCardOfTheDay.mDateModified) : Html.Label(ValueDomain.FIELD_UNAVAILABLE))
    </p>
    <p>@(Model.mCardOfTheDay.mDateLastDisplayed != null ? Html.DisplayFor(_item => _item.mCardOfTheDay.mDateLastDisplayed) : Html.Label(ValueDomain.FIELD_UNAVAILABLE))</p>
    <p>
        @*@Html.EditorFor(_item => _item.mCardOfTheDay.mStartDate, new { @class = "datePick", @type="date" })*@
        @*@Html.TextBoxFor(_item => _item.mCardOfTheDay.mStartDate, new {@id = "dateStart"})*@
      @*  @Html.TextBoxFor(_item => _item.mCardOfTheDay.mStartDate, new
            {
                @value = (DateTime?) Model.mCardOfTheDay.mStartDate,
                @selectedDate = (DateTime?) Model.mCardOfTheDay.mStartDate,
                @class = "datePick",
                @type = "date",
                @id = "dateStart"
            })*@
    </p>
    <p>
        @Html.TextBoxFor(_item => _item.mCardOfTheDay.mEndDate, new
            {
                @value = Model.mCardOfTheDay.mEndDate,
                @selectedDate = Model.mCardOfTheDay.mEndDate,
                @class = "datePick",
                @type = "date",
                @id = "dateEnd"
            })
    </p>
</div>
<div class="clear"></div>

И CSS, чтобы показать, что я делаю с классами:

$('.datePick').datepicker({
    dateFormat: "dd/ww/yy",
});

$('.datePick').each(function () {
    var a = $(this).datepicker({
        dateFormat: "dd/ww/yy",
        defaultDate: new Date($(this).val())
    });
});

Это показывает различные проблемы, которые у меня есть. Первый:

Использование Html.TexborFor помощников с @value, @selectedDate и так далее делает отображает DatePicker, но это DatePicker по умолчанию показано значение aaaa-mm-dd вместо значения связанного приложения к модели и когда я передать модель к контроллеру ни один из данные сохраняются (что означает, что mEndDate всегда равно null);
Попытка только установить датупик заканчивается теми же результатами;
Здесь образец HTML-кода, чтобы показать вам "результаты", у меня есть: <input class="input-validation-error datePick" data-val="true" data-val-date="The field mDateCreated must be a date." data-val-required="The mDateCreated field is required." id="dateCreated" name="mCardOfTheDay.mDateCreated" selectedDate="11/21/2013 00:00:00" type="date" value=""/> <input class="input-validation-error datePick" data-val="true" data-val-date="The field mDateCreated must be a date." data-val-required="The mDateCreated field is required." id="dateCreated" name="mCardOfTheDay.mDateCreated" selectedDate="11/21/2013 00:00:00" type="date" value=""/>
И если я использую EditorFor, все, что у меня есть, - это дата в строковом формате, no datepicker.

То, что я хочу, - это датапикер с выбранной датой даты, которая передала выбранную дату методу контроллера в сообщении. Может ли кто-нибудь помочь мне понять, почему это не работает?

hsim 21 нояб. 2013, в 18:15

Источник

Теги:

html

date

datepicker

jquery-ui

asp.net-mvc-4

2 ответа

Ещё вопросы

dom · Answer 1 · 2013-11-21T14-50-00.000Z

Вы не должны переопределять значение ввода даты с той же датой в другом формате, нет причин для этого, и это вызовет только головные боли. По моему опыту вам лучше оставить его как есть.

@Html.TextBoxFor(_item => _item.mCardOfTheDay.mDateCreated, new
{
    @selectedDate = Model.mCardOfTheDay.mDateCreated,
    @class = "datePick",
    @type = "date",
    @id = "dateCreated"
})

Однако вам нужно правильно настроить датупиксера, чтобы он знал, как интерпретировать дату, поступающую из вашей базы данных. Если вы хотите показать пользователю другой формат, чем тот, который был отправлен на сервер, вы можете использовать altField (source) и altFormat (source).

Это позволит вам использовать dateFormat для отображения даты в любом формате, который вам нравится во входном для пользователя, сохраняя при этом опубликованное значение в правильном формате.

Вам больше не понадобится:

$('.datePick').each(function () {
    var a = $(this).datepicker({
        dateFormat: "dd/ww/yy",
        defaultDate: new Date($(this).val())
    });
});

Вам также необходимо избавиться от ApplyFormatInEditMode = true от атрибутов свойства модели. Пусть рамки обрабатывают даты, основанные на текущей культуре, не пытайтесь работать против нее, применяя форматы повсюду.

Просто оставьте значение текстового поля независимо от того, что отправляет ваша база данных, и используйте функциональность datapicker, чтобы делать то, что вам нужно на стороне клиента.

Единственный раз, когда я бы посоветовал переопределить ценность, - это если вы беспокоитесь о том, как вводить время, когда требуется только дата. В этом случае вы должны сделать это так:

@Html.TextBoxFor(_item => _item.mCardOfTheDay.mDateCreated, new
{
    @selectedDate = Model.mCardOfTheDay.mDateCreated,
    @class = "datePick",
    @type = "date",
    @id = "dateCreated",
    @Value = Model.mCardOfTheDay.mDateCreated.ToString("mm/d/yyyy")
})

Обратите внимание на @Value с капиталом v, это действительно важно, а не опечатка. Затем вы передаете формат даты методу ToString, но он должен быть того же формата, что и ваша база данных.

Редактировать:

Я пошел вперед и построил небольшой тестовый сценарий, чтобы попытаться воспроизвести вашу проблему. Вот что у меня есть:

Контроллер:

public ActionResult Test()
{
    return View(new TestViewModel()
    {
        DateCreated = DateTime.Now.AddDays(10)
    });
}

[HttpPost]
public ActionResult Test(TestViewModel model)
{
    return RedirectToAction("Test");
}

ViewModel:

public class TestViewModel
{
    public DateTime DateCreated { get; set; }
}

Посмотреть:

@using (Html.BeginForm())
{
    @Html.TextBoxFor(m => m.DateCreated, new {
        @type = "date",
        @Value = Model.DateCreated.ToString("d")
    })
    <input type="submit">
}

// This is the rendered input
<input Value="12/1/2013" data-val="true" data-val-date="The field DateCreated must be a date." id="DateCreated" name="DateCreated" type="date" value="12/1/2013 4:03:19 PM" />

JS:

$('input[type="date"]').datepicker();

Все это работает так, как ожидалось; datepicker имеет дату во входном значении, выбранном по умолчанию, значение model.DateCreated устанавливается на объект DateTime на пост. Заметьте, что я не перепутал форматы нигде, но в отображаемом значении, где я заменил полную дату стандартным шаблоном короткой даты.

Можете ли вы попытаться упростить свой код, чтобы соответствовать тому, что у меня есть, и сообщить мне, что происходит?

Интересно, правда, я поняла немного больше об этом. Меня расстраивает то, что я попробовал то, что вы предлагаете, но безрезультатно. : |
@ HerveS как выглядит «сырая» дата в вашей базе данных и какую культуру использует ваше приложение?
Культура: en-US, поэтому английский, я полагаю. И необработанная дата является значением DateTime.
@ HerveS Посмотрите мои изменения, дайте мне знать, если это работает. Я знаю, что он не полный, поскольку он не совсем тот, который у вас есть, но сначала постарайтесь, чтобы он заработал, а позже мы позаботимся о форматах отображения.
Ну, все похоже, даже выход, это эффект привязки, который не работает как-то.
Правильно ли связаны другие поля, и только даты заканчиваются нулем?
давайте продолжим это обсуждение в чате

Adeel Asghar · Answer 2 · 2017-06-09T23-11-00.000Z

Ну, после стольких лет вы определенно решили бы эту проблему, но все же хотели бы ответить всем, кто не знаком с этой проблемой:

Датапикер должен принимать формат ГГГГ-ММ-ДД в качестве значения. Однозначные дни и месяцы должны быть дополнены цифрой 0. Январь - 01. Вы можете просто изменить формат даты как

 @Value = Model.DateCreated.ToString("yyyy-MM-dd")