Предварительно введенные jqueryui datepicker «MM yy» отформатированные даты не отображаются при сбое проверки на стороне сервера ASP.Net - PullRequest
Новая
       9

Предварительно введенные jqueryui datepicker «MM yy» отформатированные даты не отображаются при сбое проверки на стороне сервера ASP.Net

2 голосов
/ 25 апреля 2019

Я использую дату сборщика данных jqueryui (нестандартный формат: сборщик дат "MM yy" / C # "MMMM гггг"). Когда форма не проходит проверку на стороне сервера, предварительно введенные даты не отображаются повторно при возврате в форму (т. Е. Входные данные пусты). Обратите внимание, что средство выбора даты, кажется, работает нормально в этом отношении, когда используются стандартные форматы даты (то есть не указано / по умолчанию). Также обратите внимание, что проверка работает нормально, когда сбой проверяется на стороне клиента.

Я полагаю, это связано с тем, что нестандартный формат даты не распознается датчиком при возврате проверки, потому что, если я выберу дату, отключите JavaScript в моем браузере (или закомментируйте оператор $("#internGradDate").datepicker... (ниже). )), а затем отправьте форму для сбоя проверки на стороне сервера, дата будет отображаться нормально.

Ниже приведены некоторые многообещающие методы, которые я пытался установить формат даты в представлении, но безрезультатно:

Дата только из TextBoxFor () 

@Html.TextBoxFor(m => m.internGradDate, "{0:MMMM yyyy}")

Возвращенное значение DatePicker в неправильном формате 

@Html.TextBoxFor(model => model.internGradDate,
    new { Value = Model.internGradDate.HasValue ?
          Model.internGradDate.Value.ToString("MMMM yyyy") : string.Empty })

Наконец, если я просматриваю элемент ввода datepicker в инструментальных средствах разработчика Chrome «Элементы», атрибут «value» выглядит нормально (например, value = «April 2019»), хотя сам ввод пустой.

Javascript 

$("#internGradDate")
    .datepicker({ dateFormat: "MM yy", changeYear: true, yearRange: '1988:2028' })
    .attr('readonly', 'true')
    .datepicker("option", "changeMonth", true)
    .datepicker("option", "showButtonPanel", true)
    .datepicker("option", "onClose", function (e) {
        var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
        var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
        $(this).datepicker("setDate", new Date(year, month, 1))
    })
    .keypress(function (event) {
        if (event.keyCode == 8) {
            event.preventDefault();
        }
    });

Объект передачи данных (DTO) 

[Display(Name = "Graduation ")]
[DisplayFormat(DataFormatString = "{0:MMMM yyyy}", ApplyFormatInEditMode = true)]
public DateTime? internGradDate { get; set; }

код бритвы 

<div class="row form-group form-group-override">
  <div class="col-sm-6">
    @Html.LabelFor(model => model.internGradDate, htmlAttributes: new { @class = "control-label request-label" })
  </div>
  <div class="col-sm-6">
    @Html.TextBoxFor(model => model.internGradDate, "{0:MMMM yyyy}")
    @Html.ValidationMessageFor(model => model.internGradDate, "", new { @class = "text-danger" })
  </div>
</div>

Действие контроллера 

[HttpPost]
[ValidateAntiForgeryToken]
[ValidateInput(false)]
    public ActionResult Add(Intern_DTO it, HttpPostedFileBase file1)
    {
        var Ntid = Session["username"].ToString();

        string fileExt = "";

        //Limit upload file size to 4 MB
        if (file1 != null)
        {
            if (file1.ContentLength > 4194304)
            {
                ModelState.AddModelError("file1", "Please do not exceed 4 MB image size");
            }
            else
            {
                fileExt = Path.GetExtension(file1.FileName).ToLower();
                if (fileExt != ".doc" && fileExt != ".docx" && fileExt != ".pdf")
                    ModelState.AddModelError("file1", "Resume filetypes must be docx, doc, or pdf");
            }
        } 

        if (!ModelState.IsValid)
        {
            string message = "We encountered an issue while create the Admin record. Please review the records below.";
            TempData.Remove("message");
            TempData.Add("message", message);
            return View(it);
        }
        else
        {
            ...
        }
    }

Итак, для подведения итогов неясно, почему ввод datepicker пуст при возврате в форму проверки на стороне сервера, хотя его атрибут value показывает ожидаемое содержимое (например, «April 2019», то же самое, что и предварительная форма представления).

Дайте мне знать, если возникнут вопросы, и спасибо за любые идеи.

1 Ответ

1 голос
/ 26 апреля 2019

По-видимому, из-за порядка директив datepicker - что я изначально имел «только чтение» до завершения создания экземпляра, ломает его для уже существующего значения?

Спасибо всем, кто посмотрел! 

$("#internGradDate")
  .datepicker({
      dateFormat: "MM yy",
      changeYear: true,
      changeMonth: true,
      yearRange: '1988:2028',
      showButtonPanel: true,
      onClose: function (e) {
          var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
          var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
          $(this).datepicker("setDate", new Date(year, month, 1))
      }
  }).keypress(function (event) {
      if (event.keyCode == 8) {
          event.preventDefault();
      }
  }).attr('readonly', 'true');
...