Обновленные значения поля DATE в форме не представлены - проблема - PullRequest
0 голосов
/ 09 апреля 2020

У меня есть код, который успешно вводит различные значения в форму на веб-странице, и я вижу, что данные помещаются в правильные поля в правильном формате. Когда я отправляю форму с помощью кнопки или кода «ОК», процесс завершается, но перенесенные данные Дата являются текущей датой, несмотря на то, что в поле отображается другая дата. Я могу вырезать и вставлять данные в поле, например, из Блокнота, и он отлично работает.

Вот html для начала формы:

<form action="#" method="get">
                <div class="columns group">
                    <div class="formColumn flex">

    <div id="editConference_ownerField" style="display: none">
        <div class="formRow">
            <div class="labelBlock" id="editConference_ownerLbl">Owner</div>
            <div class="fieldBlock fillspace">
                <select id="editConference_owner"></select>
            </div>
        </div>
    </div>

// The first input in this class loads find and is pulled through when the form is submitted using the OK button  

    <div class="formRow">
        <label class="labelBlock" id="editConference_labelLbl" for="editConference_label">Title</label>
        <div class="fieldBlock fillspace">
            <input type="text" class="input" id="editConference_label" maxlength="256" value="">
        </div>
    </div>

    <div id="editConference_timeFields" style="">

    <div class="formRow">
        <div class="labelBlock" id="editConference_startLbl">Start</div>
        <div class="fieldBlock calendarBlock">
            <input type="date" id="editConference_startNative" class="native_date has_native">

// The element id="editConference_start" is a date and does NOT pull through

            <input type="text" id="editConference_start" class="sl_date has_native" placeholder="DD/MM/YYYY">

// The element id="editConference_startTime" is a time DOES pull through!      

            <input type="text" id="editConference_startTime" placeholder="Time" class="ui-timepicker-input" autocomplete="off">

            <div id="start-date-picker"><div class="pika-single is-hidden is-bound" style="position: static; left: auto; top: auto;"></div></div>
            <div id="start-time-picker"></div>
        </div>
    </div>
    <div class="formRow">
        <div class="labelBlock" id="editConference_endLbl">End</div>
        <div class="fieldBlock calendarBlock">
            <input type="date" id="editConference_endNative" class="native_date has_native">

            <input type="text" id="editConference_end" class="sl_date has_native" placeholder="DD/MM/YYYY">

            <input type="text" id="editConference_endTime" placeholder="Time" class="ui-timepicker-input" autocomplete="off">
            <div id="end-date-picker"><div class="pika-single is-hidden is-bound" style="position: static; left: auto; top: auto;"></div></div>
            <div id="end-time-picker"></div>
        </div>
    </div>

Вот Javascript, который я использовал. Я тестировал его с помощью консоли Chrome F12 и работал внутри iframe. Все используемые входы имеют вид type="text". Он автоматизирует заполнение формы, за исключением проблемы, указанной выше, и отправляет ее:

\\Loading the data into the fields

    var Title = "Coding syntax test again";
    document.getElementById('editConference_label').value = Title;

    var StDate = "06/05/2020";
    document.getElementById('editConference_start').value = StDate;

    var StTime = "16:20";
    document.getElementById('editConference_startTime').value = StTime;

    var EndDate = "06/05/2020";
    document.getElementById('editConference_end').value = EndDate;

    var EndTime = "17:50";
    document.getElementById('editConference_endTime').value = EndTime;

    var Desc = "The conference description stuff";
    document.getElementById('editConference_description').value = Desc;

\\ Click 'OK'

    document.getElementById("editConference_ok").click(); 

Пытались:

1) Используя код ниже для ввода данных через id = "editConference_startNative элемент Кажется, он не работает, но я не уверен, имеет ли смысл мой код или стоит ли что-то использовать:

var StDate = document.querySelector('input[type="date"]');
StDate.value = '2020-05-05';
document.getElementById('editConference_startNative').value = StDate;

2) Создание переменной с типом даты для использования с собственной версией input

var StDate = new Date("05/05/2020");
document.getElementById('editConference_startNative').value = StDate;

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

3) Удаление окончательного кода клика, затем ожидание в течение нескольких секунд и добавление строки Click и выполнение, но это не сработало, поэтому я предполагаю, что это не вопрос задержка. Я также пробовал этот код перед кликом для задержки, но я не уверен, действителен ли он:

setTimeout(function(){}, 3000);
document.getElementById("editConference_ok").click(); 

Заранее благодарен за любые предложения.

...