Кнопка сброса и проверка начальной загрузки при изменении параметра в выборе

У меня есть выбор с параметрами. При изменении параметра я показываю разные div и использую валидатор начальной загрузки перед отправкой. Если ввод пуст и нажмите кнопку, он отключится. И кнопка смены опции не активируется. Как я могу сбросить входы и кнопку при изменении опции?

$('#shexsselect').on('change', function() {
  value = $(this).val();
  if (value == 1) {
    //do something
  } else {
    //do something
  }
});

$(document).ready(function() {
  $('#form_fin').bootstrapValidator({
    message: 'This value is not valid',
    feedbackIcons: {
      valid: 'glyphicon',
      invalid: 'glyphicon',
      validating: 'glyphicon glyphicon-refresh'
    },
    fields: {
      pinofsv: {
        message: 'The username is not valid',
        validators: {
          notEmpty: {
            message: 'for label 2'
          },
        }
      },
      shexsselect: {
        validators: {
          notEmpty: {
            message: 'choose'
          }
        }
      },
      voen: {
        validators: {
          notEmpty: {
            message: 'for label2'
          }
        }
      }
    }
  });
});
<form name="form_fin" id="form_fin" action="" method="POST">
  <div class="col-sm-12">
    <div class="form-group" id="shexsdiv">
      <label>Selectionn: </label>
      <select class="form-control " name="shexsselect" id="shexsselect" required>
        <option value='' selected disabled>Choose</option>
        <option value='1'>First</option>
        <option value='2'>Second</option>
      </select>
    </div>
  </div>
  <div class="col-sm-12" id="voendiv">
    <div class="form-group">
      <label>label2:</label>
      <input type="text" class="form-control " name="voen" id="voen">
    </div>
  </div>
  <div class="col-sm-12" id="fin_input">
    <div class="form-group">
      <label>Label2:</label>
      <div class="input-group">
        <input type="text" class="form-control" name="pinofsv" id="pinofsv" required />
      </div>
    </div>
  </div>
  <div class="col-sm-12">
    <button type="submit" class="btn btn-info" name="checkfin" id="checkfin">Submit</button>
  </div>
</form>

Пробовал excluded: [':disabled'], но не помогло и через jquery пробовал сбросить и очистить, но не помогает


javascript jquery twitter-bootstrap-3 html-select
person Orik00    schedule 18.07.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Добавьте onchange внутри вашего select, и вы вызовете свою функцию для сброса значений полей ввода.

Ниже приведен рабочий код:

function resetFields() {
  document.getElementById("voen").value = "";
  document.getElementById("pinofsv").value ="";
}
<form name="form_fin" id="form_fin" action="" method="POST">
  <div class="col-sm-12">
    <div class="form-group" id="shexsdiv">
      <label>Selectionn: </label>
      <select onchange="resetFields()" class="form-control " name="shexsselect" id="shexsselect" required>
        <option value='' selected disabled>Choose</option>
        <option value='1'>First</option>
        <option value='2'>Second</option>
      </select>
    </div>
  </div>
  <div class="col-sm-12" id="voendiv">
    <div class="form-group">
      <label>label2:</label>
      <input type="text" class="form-control " name="voen" id="voen">
    </div>
  </div>
  <div class="col-sm-12" id="fin_input">
    <div class="form-group">
      <label>Label2:</label>
      <div class="input-group">
        <input type="text" class="form-control" name="pinofsv" id="pinofsv" required />
      </div>
    </div>
  </div>
  <div class="col-sm-12">
    <button type="submit" class="btn btn-info" name="checkfin" id="checkfin">Submit</button>
  </div>
</form>

Подробнее о событии onchange читайте здесь.

person Vikasdeep Singh    schedule 18.07.2018
comment
Спасибо за ответ. Да, это сбрасывает входное значение, но не активирует кнопку и не скрывает текст проверки (который выполняет проверку начальной загрузки). - person Orik00; 18.07.2018
comment
@ Orik00 Orik00 этого не было в требовании. Этот ответ соответствует вашему требованию, которое вы упомянули в своем вопросе. - person Vikasdeep Singh; 18.07.2018
comment
основная проблема это кнопка сброса, ввод сброса прост, в любом случае спасибо за ответ) - person Orik00; 18.07.2018