Заполните поле другим значением поля в гравитационных формах - PullRequest
0 голосов
/ 06 января 2020

В настоящее время у меня есть простая гравитационная форма на моем веб-сайте Wordpress, которая включает поле переключателя с 3 вариантами: (Один, Женат, Исключен).

Я хочу динамически заполнить отдельное скрытое текстовое поле в та же форма со значением «Исключить», если пользователь выбирает опцию «Исключить» в поле переключателя. Если пользователь выбирает один из других вариантов (одиночный или женатый), мне бы хотелось, чтобы значение в текстовом поле было равно NULL.

Кто-нибудь делал что-то подобное раньше, и если да, могли бы вы помочь мне с шагами, чтобы выполнить sh это?

1 Ответ

1 голос
/ 06 января 2020

Вам необходимо добавить код в пользовательский файл JavaScript. Вы можете прочитать в очереди JavaScript файлов здесь . В своем комментарии вы предоставляете только один идентификатор для radio входов, но каждый вход должен иметь свой уникальный идентификатор. Итак, предполагая, что ваши единственные радиовходы в этой форме - это те 3 входа, вы также можете нацелить на type (как я сделал ниже). Если вы хотите поделиться HTML вашей формы, я могу адаптировать ответ к вашему конкретному сценарию c.

// Document ready function for Wordpress
jQuery(function($) {
  $('form#25 input[type="radio"]').change(function(){
    if (this.value === 'exempt') {
      $('input#26').val(this.value);
    } else {
      $('input#26').val(null);
    }
  })
});
label {
  display:block;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="25">
  <label>Single<input type="radio" name="marriage-status" value="single" /></label>
  <label>Married<input type="radio" name="marriage-status" value="married" /></label>
  <label>Exempt<input type="radio" name="marriage-status" value="exempt" /></label>
  <!-- HIDDEN INPUT -->
  <input id="26" type="text" />
</form>

Похоже, что ваша форма имеет только radio входы для «Статус подачи», поэтому вы можете сделать это следующим образом:

// Document ready function for Wordpress
jQuery(function($) {
  $('form#gform_25 input[type="radio"]').change(function(){
    if (this.value === 'Exempt') {
      $('input#input_25_24_valid').val(this.value);
    } else {
      $('input#input_25_24_valid').val(null);
    }
  })
});
ul {
  padding-left:0;
}
li {
  list-style-type:none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="gform_25">
  <li id="field_25_9" class="gfield gfield_contains_required field_sublabel_below field_description_below gfield_visibility_visible">
     <label class="gfield_label">Filing Status<span class="gfield_required">*</span></label>
     <div class="ginput_container ginput_container_radio">
        <ul class="gfield_radio" id="input_25_9">
           <li class="gchoice_25_9_0"><input name="input_9" type="radio" value="Single or Married filing sperately" id="choice_25_9_0"><label for="choice_25_9_0" id="label_25_9_0">Single or Married filing sperately</label></li>
           <li class="gchoice_25_9_1"><input name="input_9" type="radio" value="Married filing jointly" id="choice_25_9_1"><label for="choice_25_9_1" id="label_25_9_1">Married filing jointly (or Qualifying widow(er))</label></li>
           <li class="gchoice_25_9_2"><input name="input_9" type="radio" value="Head of household" id="choice_25_9_2"><label for="choice_25_9_2" id="label_25_9_2">Head of household (Check only if you're unmarried and pay more than half the costs of keeping up a home for yourself and a qualifying individual.)</label></li>
           <li class="gchoice_25_9_3"><input name="input_9" type="radio" value="Exempt" id="choice_25_9_3"><label for="choice_25_9_3" id="label_25_9_3">Exempt</label></li>
        </ul>
     </div>
  </li>
  
  <!-- Your hidden input -->
  <input type="text" class="gform_hidden" name="input_25_24_valid" id="input_25_24_valid">
</form>
...