как настроить форму validator.js, чтобы отправлять форму, только если установлен флажок - PullRequest
0 голосов
/ 07 мая 2019

Я сделал контактную форму, используя пример на https://bootstrapious.com/p/how-to-build-a-working-bootstrap-contact-form, который работает нормально.Теперь я хотел бы добавить флажок, который должен проверять пользователь (помимо Google Reaptcha и обязательных полей формы), если он хочет иметь возможность отправить форму.

Я думаю, что мне нужно настроить валидаторФайл .js, но, поскольку я не знаю javascript, я не знаю, как редактировать существующий файл валидатора.

HTML дополнительного флажка:

<label>
<input type="chbox" name="chbox" id="chbox"><a href="terms.html">Terms and conditions</a>.
</label>

js:

function getValue($el) {
  return $el.is('[type="checkbox"]') ? $el.prop('checked')                                     :
         $el.is('[type="radio"]')    ? !!$('[name="' + $el.attr('name') + '"]:checked').length :
                                       $el.val()
}

var Validator = function (element, options) {
  this.options    = options
  this.validators = $.extend({}, Validator.VALIDATORS, options.custom)
  this.$element   = $(element)
  this.$btn       = $('button[type="submit"], input[type="submit"]')
                      .filter('[form="' + this.$element.attr('id') + '"]')
                      .add(this.$element.find('input[type="submit"], button[type="submit"]'))

  this.update()

  this.$element.on('input.bs.validator change.bs.validator focusout.bs.validator', $.proxy(this.onInput, this))
  this.$element.on('submit.bs.validator', $.proxy(this.onSubmit, this))
  this.$element.on('reset.bs.validator', $.proxy(this.reset, this))

  this.$element.find('[data-match]').each(function () {
    var $this  = $(this)
    var target = $this.data('match')

    $(target).on('input.bs.validator', function (e) {
      getValue($this) && $this.trigger('input.bs.validator')
    })
  })

  this.$inputs.filter(function () { return getValue($(this)) }).trigger('focusout')

  this.$element.attr('novalidate', true) // disable automatic native validation
  this.toggleSubmit()
}

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

1 Ответ

0 голосов
/ 08 мая 2019

о, я только что узнал, что HTML-код для флажка был неполным. я добавил required="required". полная линия сейчас <input type="checkbox" name="chbox" id="chbox" required="required"> и теперь, наконец, работает как задумано.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...