添加验证以查看单选按钮是否未选中 [英] Adding validations to see if radio button is not selected

问题描述

我有以下代码：

 < li> 1。问题1< / li> 
< li> 
< input type =radioname =question1id =sd1value =1>非常不赞同
< input type =radioname =question1id = d1value =2>不同意
< input type =radioname =question1id =n1value =3>既不同意也不反对
< input type =radioname =question1id =a1value =4> Agree 
< input type =radioname =question1id =sa1value =5 >非常赞同
< / li> 
< br />< br /> 
 
< li> 2。问题2< / li> 
< li> 
< input type =radioname =question2id =sd2value =1>非常不赞同
< input type =radioname =question2id = d2value =2>不同意
< input type =radioname =question2id =n2value =3>既不同意也不反对
< input type =radioname =question2id =a2value =4> Agree 
< input type =radioname =question2id =sa2value =5 >非常赞同
< / li> 
< br />< br /> 
 
< li> 3。问题3< / li> 
< li> 
< input type =radioname =question3id =sd3value =1>非常不赞同
< input type =radioname =question3id = d3value =2>不同意
< input type =radioname =question3id =n3value =3>既不同意也不反对
< input type =radioname =question3id =a3value =4> Agree 
< input type =radioname =question3id =sa3value =5 >非常赞同
< / li> 
< br />< br /> 
 
< input type =submitvalue =Submitname =Submitid =Submit/> 
  

我有这样30个问题。我的要求是，用户必须回答所有30个问题。

如何编写javascript函数，以便向用户显示消息，如果他甚至不回答的问题。
编辑：

我的JavaScript的问题在于：

 <$ c $（thisfrm.question3 [0] .checked == false）||（thisfrm.question3 [1] .checked == false）||（thisfrm.question3 [2] .checked == false）|| （thisfrm.question3 [3] .checked == false）||（thisfrm.question3 [4] .checked == false））
 {
 alert（'请回答问题1'）; 
返回false; 
} 
  

对于没有循环的每个问题，重复上述代码。即它是为每个问题写的。但即使所有的问题都回答，它仍然显示请回答问题1

解决方案

此方法使用jQuery并检查未选中单选按钮中的一组答案

HTML - 为您的问题添加一个类< li>

 < li> 1。问题1< / li> 
< li class =option> 
< input type =radioname =question1id =sd1value =1>非常不赞同
< input type =radioname =question1id = d1value =2>不同意
< input type =radioname =question1id =n1value =3>既不同意也不反对
< input type =radioname =question1id =a1value =4> Agree 
< input type =radioname =question1id =sa1value =5 >非常赞同
< / li> 
  

Javascript

  //委托提交动作
 $（document）.on（'submit'，'form'，function（）{
 
 var validate = true; 
 var unanswered = new Array（）; 
 
 //遍历可用集合
 $（'。option'）。each（function（）{
 //问题文本$ b $ （$：this）.find（'input'）。is（'：checked'））{
 //未验证...显示提醒或做某事
 unanswered.push（question.text（））; 
 question.css（'color'，'red'）; //突出未答复的问题
 validate = false; 
} 
}）; 
 
 if（unanswered.length> 0）{
 msg =Please answer以下问题：\ n+ unanswered.join（'\\\
'）; 
 alert（msg）; 
} 
 return validate; 
}）; 
  

示例 http://fiddle.jshell.net/6jNpQ/2/

I have the following code:

 <li>1. question 1</li>
<li>
     <input type="radio" name="question1" id="sd1" value="1">Strongly Disagree
     <input type="radio" name="question1" id="d1" value="2">Disagree
     <input type="radio" name="question1" id="n1" value="3">Neither Agree Nor Disagree
    <input type="radio" name="question1" id="a1" value="4">Agree
     <input type="radio" name="question1" id="sa1" value="5">Strongly Agree
</li>
<br/><br/>

<li>2.  question 2 </li>
<li>
     <input type="radio" name="question2" id="sd2" value="1">Strongly Disagree
     <input type="radio" name="question2" id="d2" value="2">Disagree
     <input type="radio" name="question2" id="n2" value="3">Neither Agree Nor Disagree
    <input type="radio" name="question2" id="a2" value="4">Agree
     <input type="radio" name="question2" id="sa2" value="5">Strongly Agree
</li>
<br/><br/>

<li>3.  question 3</li>
<li>
     <input type="radio" name="question3" id="sd3" value="1">Strongly Disagree
     <input type="radio" name="question3" id="d3" value="2">Disagree
     <input type="radio" name="question3" id="n3" value="3">Neither Agree Nor Disagree
     <input type="radio" name="question3" id="a3" value="4">Agree
     <input type="radio" name="question3" id="sa3" value="5">Strongly Agree
</li>
<br/><br/>

  <input type="submit" value="Submit" name="Submit" id="Submit" />

I have such 30 questions. My requirement is that the user must answer all 30 questions.

How do I write javascript function such that a mesage is shown tot he user if he doesnt answer even one of the questions. EDIT:

The problem with my javascript i sthis:

   if ( (thisfrm.question3[0].checked == false) || (thisfrm.question3[1].checked == false) || (thisfrm.question3[2].checked == false) || (thisfrm.question3[3].checked == false) || (thisfrm.question3[4].checked == false))
{
    alert('Please answer question 1');
    return false;
}

the above code is repeated for every question without loop. i.e. it is written for each ques. but even when all ques are answered,it still displays Please answer question 1

解决方案

This method makes use of jQuery and checks for unchecked radio buttons in a set of answers

HTML - add a class to your questions <li>

<li>1. question 1</li>
<li class="option">
     <input type="radio" name="question1" id="sd1" value="1">Strongly Disagree
     <input type="radio" name="question1" id="d1" value="2">Disagree
     <input type="radio" name="question1" id="n1" value="3">Neither Agree Nor Disagree
     <input type="radio" name="question1" id="a1" value="4">Agree
     <input type="radio" name="question1" id="sa1" value="5">Strongly Agree
</li>

Javascript

// Delegate submit action
$(document).on('submit', 'form', function () {

    var validate = true;
    var unanswered = new Array();

    // Loop through available sets
    $('.option').each(function () {
        // Question text
        var question = $(this).prev();
        // Validate
        if (!$(this).find('input').is(':checked')) {
            // Didn't validate ... dispaly alert or do something
            unanswered.push(question.text());
            question.css('color', 'red'); // Highlight unanswered question
            validate = false;
        }
    });

    if (unanswered.length > 0) {
        msg = "Please answer the following questions:\n" + unanswered.join('\n'); 
        alert(msg);
    }
    return validate;
});

Example here http://fiddle.jshell.net/6jNpQ/2/

这篇关于添加验证以查看单选按钮是否未选中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！