Данные из главной таблицы не заполняют поле даты ввода модальной формы

#javascript #html #jquery #model-view-controller #c#-3.0

#javascript #HTML #jquery #модель-представление-контроллер #c #-3.0

Вопрос:

Данные в поле даты ввода (называемом ITEnterDate) модальной формы не отображаются, хотя данные во всех других полях заполняются. Если я превращаю поле в модальном виде в текст ввода, тогда отображаются данные. Хотя это должна быть дата ввода, чтобы пользователь мог выбирать из типа средства выбора даты. Что я делаю не так?

К вашему СВЕДЕНИЮ, его функционирование: я нажимаю «Редактировать» для записи в главной таблице, а затем открывается модальная форма со всеми полями, заполненными данными из главной таблицы.

ДОПОЛНИТЕЛЬНАЯ ИНФОРМАЦИЯ: Например, значение Даты ввода одной из записей в основной форме равно 8/2/2020, которое хранится в столбце SQL типа date.

Вот мой код:

Модель

 public string ITEnterDate { get; set; 
  

JAVASCRIPT ДЛЯ ЗАГРУЗКИ ДАННЫХ В ОСНОВНУЮ ТАБЛИЦУ

 $(document).ready(function () {
    loadData();
})

function loadData() {
    $.ajax({
        url: "/Tickets/ListITTasks",
        type: "GET",
        contentType: "application/json;charset=utf-8",
        dataType: "json",
        success: function (result) {
            var html = '';
            $.each(result, function (key, item) {
                html  = '<tr>';
                html  = '<td>'   item.ITNumber   '</td>';
                html  = '<td>'   item.ITEnterDate   '</td>';
                ......

             html  = '<td><a href="#" onclick="return getbyTicketNumber('   item.ITNumber               ')">Edit</a> | <a href="#" onclick="DeleteItTask('   item.ITNumber   ')">Delete</a></td>';
                html  = '</tr>';
            });
            $('.tbody').html(html);
        },
        error: function (errormessage) {
            alert(errormessage.responseText);
        }
    });
}
  

JAVASCRIPT ДЛЯ ПОЛУЧЕНИЯ ДАННЫХ Из ГЛАВНОЙ ТАБЛИЦЫ И ЗАПОЛНЕНИЯ ИМИ МОДАЛЬНЫХ ПОЛЕЙ

 function getbyTicketNumber(TicketNumber) {
    $('#ITEnterDate').css('border-color', 'lightgrey');
    .....

    $.ajax({
        url: "/Tickets/GetTaskByTicketNumber/"   TicketNumber,
        typr: "GET",
        contentType: "application/json;charset=UTF-8",
        dataType: "json",
        success: function (result) {
            $('#ITNum').val(result.ITNumber);
            $('#ITEnterDate').val(result.ITEnterDate);
            .....

            $('#myModal').modal('show');
            $('#btnUpdate').show();
            $('#btnAddItTask').hide();
        },
        error: function (errormessage) {
            alert(errormessage.responseText);
        }
    });
    return false;
}
  

КОНТРОЛЛЕР

 public JsonResult GetTaskByTicketNumber(int id)
        {
            HelpDeskDBHandle hdDB = new HelpDeskDBHandle();
            var ITNumber = hdDB.GetITTasksList().Find(x => x.ITNumber.Equals(id));
            return Json(ITNumber, JsonRequestBehavior.AllowGet);
        }
  

МОДАЛЬНАЯ ФОРМА

 <div class="modal-body">
                <form>
                    <div class="form-group">
                        <label for="ITEnterDate">Enter Date</label>
                        <input type="date" class="form-control" id="ITEnterDate"                                                             placeholder="Enter Date" />
                    </div>
                    .......

                </form>
</div>
  

Ответ №1:

$(‘.tbody’).html(html); вы уверены, что класс ‘.tbody’ не перепутан с элементом ‘tbody’?

Комментарии:

1. Я бы так не думал, поскольку, когда я меняю тип ввода на текст вместо даты, поле даты ввода заполняется. Плюс все остальные поля заполняются.

Ответ №2:

Найдено решение. Для даты ввода требовались данные в формате ГГГГ-ММ-ДД, поэтому я добавил следующий код в DataReader:

 ITEnterDate = String.Format("{0:yyyy-MM-dd}", sdr["ITEnterDate"])