Определить, установлен ли флажок или не используется мастер форм - PullRequest
Новая
       49

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

0 голосов
/ 22 апреля 2019

В настоящее время я использую мастер форм: 

<form name="example-1" id="wrapped" action="" method="POST">
     <div id="middle-wizard">
           <div class="step">
           </div>
           <div class="step">
           </div>
           <div class="step">
                <div class="row">
                    <div class="col-md-6">
                         <ul class="data-list-2 clearfix">
                               <li><input name="information[]" id ="other_info" class="otherInfo check_radio" type="checkbox"  value="Others"><label>Others</label></li>
                         </ul>
                    </div>
                </div>
           </div>
     </div>


<div id="bottom-wizard">
            <button type="button" name="backward" class="backward"> Backward </button>
            <button type="button" name="forward" class="forward"> Forward </button>
</div>
</form>

Я пытаюсь проверить, установлен флажок или нет. Первое, что я сделал, - консольный лог-идентификатор флажка.

Консоль возвращает флажок, но когда я пытался создать функцию щелчка по идентификатору флажка, функция щелчка не создает журнал консоли.

Вот пример функции нажатия, которую я пробовал: 

console.log('#other_info')
    $("#other_info").click(function(){
        if(!$(this).is(':checked'))
        {
            console.log('yes its checked')
        }
        else
        {
            console.log('no its not!!')
        }
    })

эта форма использует пользовательский плагин iCheck для флажков, поэтому обычная функция щелчка или изменения не будет работать. закончил исправление проблемы с помощью пользовательской функции из ichecked

Ответы [ 3 ]

0 голосов
/ 22 апреля 2019

Попробуйте использовать Изменить вместо клика 

   $('#other_info').change(function() {
        if(this.checked) {

             console.log('yes its checked')
        }
      else
         {
     console.log('no its not!!')
         }

    });
0 голосов
/ 22 апреля 2019

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

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

, поэтому

вместо использования этой функции:

$('#other_info').on('change', function(event) {
    var checkboxChecked = $(this).is(':checked');

    if(checkboxChecked) {
        alert("checked");      
    }else{
        alert("un-checked");
    }
});

Я использую эту функцию вместо: 

$('#other_info').on('ifChanged', function(event) {
    var checkboxChecked = $(this).is(':checked');

    if(checkboxChecked) {
        alert("checked");
    }else{
        alert("un-checked");
    }
});
0 голосов
/ 22 апреля 2019

Вы не должны использовать click слушатель в таком случае, но change слушатель.Я считаю, что его гораздо эффективнее использовать.

Вот фрагмент кода в качестве быстрого выноса ( рабочая скрипка ): 

document.querySelector('#wrapped').addEventListener('change', function(event) { 
  const allClicked = this.querySelectorAll('input[type="checkbox"]:checked')
  console.log(allClicked)

  console.log(`Chief, I am clicked: ${event.target}!`) // Show what is currently being clicked
})

Также вы можете прочитать больше натема в моем подобном ответе здесь: Как подсчитать все отмеченные флажки

Вот более сложная скрипка: https://jsfiddle.net/mkbctrlll/yak4oqj9/159/

Внутри у вас есть 3 возможных способа решения вашей проблемы.вопрос.Надеюсь, это поможет

...