Проверка петрушки - форма ASP.NET с панелью обновления

Question

Я работаю над устаревшим приложением asp.net. Я обновляю существующую форму, чтобы иметь новый визуальный стиль и использовать проверку петрушки.

Ранее мы использовали элементы управления проверкой веб-форм, но мы обновили их до петрушки, поскольку это дает более приятный пользовательский интерфейс и позволяет стилизовать проверяемый элемент управления при сбое проверки (в нашем случае в качестве фона для ввода используется красный крестик). коробка)

Форма имеет панель обновления для поиска по почтовому индексу / адресу. Пользователь вводит свой почтовый индекс и нажимает кнопку "Найти адрес", которая запускает обратную передачу на панели обновлений. Я смог разделить две секции формы (проверка основной формы и только ввод почтового индекса), так что пользователь Запрашивается ввод почтового индекса только при нажатии "Найти адрес" (используя data-parsley-group="почтовый индекс" в поле ввода и кнопке). Я добавил событие нажатия кнопки onclient для кнопки, чтобы запустить проверку перед запуском события onClick кнопки. Смотрите ниже фрагменты.

<asp:ImageButton ID="addressLockup" runat="server" ImageUrl="/images/btn-find-address-off.gif" class="rollover" OnClientClick="return ValidatePostcode()" OnClick="Lookup_btn_Click"   CausesValidation="false" data-parsley-group="postcode"  />

function ValidatePostcode() {
  console.log("do postcode validaiton");
  if (true === $('#aspnetForm').parsley("postcode").validate("postcode", true)) {
    return true;
  }

  return false;
}

Теперь по моей проблеме:

Как сказано выше, он корректно проверяет, что почтовый индекс был введен, показывая красный крест только в поле ввода почтового индекса, если эта проверка не удалась. Однако, как только почтовый индекс введен правильно и пользователь нажимает кнопку, он корректно вызывает событие onClick, но на этом этапе все остальные проверенные поля ввода, подтвержденные петрушкой, которые не были заполнены правильно, показывают состояние ошибки петрушки. (показывает красный крестик в моем случае).. Я смог очистить их после завершения обратной передачи, но вы кратко увидите мигание красных крестиков, которое клиент не примет..

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

Спасибо за чтение, Дэнни

Answer 1

Я нашел рабочую площадку для этого, изменив стиль ошибки петрушки до того, как произошла обратная передача, а затем удалив стили ошибки петрушки из всех элементов управления, изменив стиль ошибки петрушки после перезагрузки страницы: немного странно, но это работает..Если у кого-то есть лучшее решение, было бы здорово услышать это!

  function ValidatePostcode() {
            console.log("do postcode validaiton");
            if (true === $('#aspnetForm').parsley("postcode").validate("postcode", true)) {

                var style = '<style type="text/css">#accountRegisterContainer input.parsley-error {background: url(""); background-color: #ffffff;}#accountRegisterContainer select.parsley-error { background: url("") ;background-color: #ffffff;}</style>';
                $("head").append(style);
                

                return true;
            }

            return false;
        }


        function pageLoad(sender, args) {
             $(".parsley-error").removeClass("parsley-error");
             var style = '<style type="text/css">#accountRegisterContainer input.parsley-error {background: url("/Images/parsley-cross.png") no-repeat right 10px center;; background-color: #ffffff;}#accountRegisterContainer select.parsley-error { background: url("/Images/parsley-tick.png") no-repeat right 10px center;background-color: #ffffff;}</style>';
            $("head").append(style);
        }