Удалить кнопку «Отправить», если форма подтверждена

Question

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

Форма использует метод проверки Magento Javascript для проверки полей, и если все поля проверены, то я хотел бы удалить кнопку отправки при первом щелчке и заменить ее на «В».обрабатывать сообщениеТаким образом, пользователь не сможет дважды щелкнуть или несколько раз щелкнуть кнопку.

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

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

Любая помощь будетТАК оценили !!!Заранее спасибо.

<form name="<em><strong>my-custom-form</strong>" id="my-custom-form" action="" method="post">

<label for="firstname">< ?php echo $this->__('First name') ?> <span class="required">*</span></label><br />
<input id="firstname" name="firstname" class="<em/><strong>input-text required-entry</strong>" />

<label for="lastname">< ?php echo $this->__('Last name') ?> <span class="required">*</span></label><br />
<input id="lastname" name="lastname" class="<em/><strong>input-text required-entry</strong>" />

<label for="useremail">< ?php echo $this->__('Email') ?> <span class="required">*</span></label><br />
<input type="text" name="useremail" id="useremail" class="<em/><strong>input-text required-entry validate-email</strong>" />

<input type="submit" name="submit" value="<?php echo $this-/>__('Submit') ?>" />

</form>< ?php /* END OF my-custom-form */?>

<script type="text/javascript">
 //< ![CDATA[
   var customForm = new VarienForm('<em><strong>my-custom-form</strong>');
 //]]>
</script>

Answer 1

Не уверен, как Magento мог бы соответствовать, потому что я не слишком знаком с этим, но процесс обычно работает так:

$('#my-custom-form').submit(function(){
    $('input[type=submit]', this).attr('disabled', true);

    // validate form

    if (valid) {
        return true;
    } else {
        $('input[type=submit]', this).attr('disabled', false);
        return false;
    }
});

Answer 2

Я не вижу вашего кода проверки выше, но если мы предположим, что это логическая функция, вы можете просто:

if (validatation()) {
  $('#my-custom-form').submit(function(){
   $('input[type=submit]', this).attr('enabled', 'enabled');
   $('input[type=submit]', this).val('In process...');
  });
} else { 
  $('#my-custom-form').submit(function(){
    $('input[type=submit]', this).attr('disabled', 'disabled');
  });
}

Я бы предложил две вещи:

1) Отбросить«В процессе ...», это только усложняет работу пользователя во второй раз, если вы не продолжаете выполнять валидацию () для каждого изменения и возвращаете текст обратно.

2) Добавьте двойной щелчокпрофилактика:

    $('my-custom-form').submit(function(){
       $('input[type=submit]', this).attr('disabled', 'disabled');
       $('select', this).attr('disabled', 'disabled');
       $('input[type=text]', this).attr('readonly', 'readonly');
       $('textarea', this).attr('readonly', 'readonly');
  });

Answer 3

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

Если вы еще не используете jQuery, вы можете просто скрыть кнопку отправки, а не полностью ее удалить.Удаление кнопки может вызвать проблемы с привязкой событий, в зависимости от того, как вы их настроили.

Это, вероятно, самая большая помощь, которую вы получите без небольшого количества кода / информации.