如何检查是否检查了分区中的所有单选按钮

How to check if all the radio button gropus in a division are checked or not?

本文关键字:检查 单选按钮 分区 是否 何检查      更新时间:2023-09-26

我正在加权一个代码,用户将在其中选择他们被问到的问题的答案。每页会有多个问题。我希望所有这些问题都能得到解答。下面是问题表单的代码,其中问题在循环中从数据库动态调用。

<form id="radio-demo" class="radio-demo" action="<?php echo get_site_url(); ?>/register-response" method="POST">
    <?php
/* print_r($categories); */
/*loop to get questions for each categories*/
foreach($cat as $categories){       
$software = $wpdb->get_results("SELECT * FROM ". $wpdb->prefix ."statement where statement_category_id =".$categories->statement_category_id);
$j++;
    $table = $software;
    $c_id = $categories->statement_category_id;     
    $i = 0;
    ?>
     <div class="custom_hide" id="page_<?php echo $j;?>">
     <?php
     $cat_name = $categories->statement_category;
     /*loop for the number of questions per category */
    foreach($table as $software) {
        $i++; 
        ?>

        <div class="question_one">
            <p><?php echo $i.". ".$software->statement;?></p>

              <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="first-choice-<?php echo $i;?>" value="<?php echo 1*$software->weight;?>" required = "required"/> 
                <label for="first-choice">1</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="second-choice-<?php echo $i;?>" value="<?php echo 2*$software->weight;?>" required = "required"/> 
                <label for="second-choice">2</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="third-choice-<?php echo $i;?>" value="<?php echo 3*$software->weight;?>" required = "required"/> 
                <label for="third-choice">3</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="four-choice-<?php echo $i;?>" value="<?php echo 4*$software->weight;?>" required = "required"/> 
                <label for="four-choice">4</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="five-choice-<?php echo $i;?>" value="<?php echo 5*$software->weight;?>" required = "required"/> 
                <label for="five-choice">5</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="six-choice-<?php echo $i;?>" value="<?php echo 6*$software->weight;?>" required = "required"/> 
                <label for="six-choice">6</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="seven-choice-<?php echo $i;?>" value="<?php echo 7*$software->weight;?>" required = "required"/> 
                <label for="seven-choice">7</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="eight-choice-<?php echo $i;?>" value="<?php echo 8*$software->weight;?>" required = "required"/> 
                <label for="eight-choice">8</label>
              </label>
               <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="nine-choice-<?php echo $i;?>" value="<?php echo 9*$software->weight;?>" required = "required"/> 
                <label for="nine-choice">9</label>
              </label>
              <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="ten-choice-<?php echo $i;?>" value="<?php echo 10*$software->weight;?>" required = "required"/> 
                <label for="ten-choice">10</label>
              </label>
              <label class="radio-inline">
                <input type="radio" name="<?php echo $c_id.'_'.$i;?>" id="eleven-choice-<?php echo $i;?>" value="<?php echo 0*$software->weight;?>" required = "required"/> 
                <label for="eleven-choice">No Opinion</label>
              </label>
             <!-- <input type="hidden" name="currentID" value="<?php echo $c_id; ?>" />-->

    </div> <?php }?>
    <div class="bottum_btn">
    <div class="">
        <?php if($j > 1){?>
        <div class="back_btn">
            <a onclick="custom_back(<?php echo $j-1;?>)"><i class="fa fa-chevron-circle-left">Back</i> </a>
        </div>
        <?php
        }
        if($j == $catcount){?>
        <div class="next_btn">
        <input name="submit" type="submit" id="submit_btn" value="submit""><i class="fa fa-chevron-circle-right"></i></input>
        </div>
        <!--<a name="submit"  id="submit_btn" onClick="PopUp()">submit<i class="fa fa-chevron-circle-right"></i>
        </a>-->
    <?php } else
    {
        ?>
        <div class="next_btn">
        <a onclick="custom_next(<?php echo $j+1;?>)">Next<i class="fa fa-chevron-circle-right"></i> </a>
        </div><?php
    }?>
    </div>
</div>
    </div>
<?php }?>

我正在尝试的脚本如下。

function custom_next(val) {
        var val1 = "#page_" + val;
        var val2 = "#page_" + (val - 1);            
        var questions = jQuery(".question_one");
        var maindiv = jQuery(val2);
        if (jQuery(val2+':not(:has(:radio:checked))').length > 1) {
            console.log(jQuery(val2+':not(:has(:radio:checked))').length);
            alert("At least one group is blank");
        }else{
                console.log(jQuery(val2+':not(:has(:radio:checked))').length);
                jQuery(val1).removeClass("custom_hide");
                jQuery(val1).addClass("custom_show");
                jQuery(val2).removeClass("custom_show");
                jQuery(val2).addClass("custom_hide");
        }}

但是这个脚本正在检查"是否选中任何单选按钮组",我希望检查所有单选按钮组

我已经分析了您的代码,并为您的脚本开发了此代码。此脚本检查是否选中了任何问题选项。

function custom_next(val) {
        var val1 = "#page_" + val;
        var val2 = "#page_" + (val - 1);        
        var i = 0;
        var j = 0;
        jQuery('div.custom_show input[type=radio]').each(function(){                            
            var status = jQuery(this).is(':checked');
            //alert(status);
            i=i+1;
            if(status == true){
                j=j+1;
            }               
        });         
        i= i/11;
        if(i == j){
            jQuery(val1).removeClass("custom_hide");
                jQuery(val1).addClass("custom_show");
                jQuery(val2).removeClass("custom_show");
                jQuery(val2).addClass("custom_hide");
        }else{
            alert("All Questions are mandetory!!");
        }
}   

首先在窗体中查找所有单选按钮组

var radio_groups = [];
$("#radio-demo :radio").each(function(){
    radio_groups.push(this.name);
});

现在遍历所有这些,看看是否有任何一个未被选中

var isAnyUnselected = radio_groups.filter( function(vallue){
  return $(":radio[name='"+group+"']:checked").length == 0
} ).length > 0;

检查isAnyUnselectedtrue(某些未选中)还是false(全部选中)

但是这个脚本正在检查"是否选中任何单选按钮组",我希望检查所有单选按钮组。

您需要做的是检查是否至少有一个未选中的单选框。小例子:

<input class="answers" type="radio"/>
<input class="answers" type="radio"/>
if ($('.ans').not(':checked').length)
{
    console.log('At least one not checked, please check all');
}
else
{
    console.log('All checked');
}

如果您不想更改 html,您可以使用选择器jQuery("input[type='radio']:not(:checked)")如果此选择器的.length大于 1,则有一些输入需要检查。简单的例子 这里 se 控制台日志。

否则,您可以使用必需的属性 link1 link2