让用户检查表单上的所有答案

时间:2015-03-02 05:36:04

标签: php forms

有没有办法修改我的数据库驱动的测验,这样,如果用户没有回答一个或多个问题,点击“提交”按钮会触发警报?换句话说,我想强迫用户回答所有问题,即使他们只是猜测。除非所有问题都有回应,否则评分机制无法正常工作。

请注意,有些问题(本例中的最后一个)可能有多个正确答案。我认为最重要的是至少选择了一个复选框。

<form action="" method="post" id="quiz">

  <li id="q9">
    <div class="Question">Scientists believe the universe is:</div>
    <div class="Answer">
      <label class="Wide" for="q9-A"><div class="Radio"><input type="radio" name="q9[]" id="q9-A" value="A" style="display: none;"> A. disappearing</div></label></div>
    <div class="Answer">
      <label class="Wide" for="q9-B"><div class="Radio"><input type="radio" name="q9[]" id="q9-B" value="B" style="display: none;"> B. expanding</div></label></div>
    <div class="Answer">
      <label class="Wide" for="q9-C"><div class="Radio"><input type="radio" name="q9[]" id="q9-C" value="C" style="display: none;"> C. contracting</div></label></div>
    <div class="Answer">
      <label class="Wide" for="q9-D"><div class="Radio"><input type="radio" name="q9[]" id="q9-D" value="D" style="display: none;"> D. becoming bipolar</div></label></div>
  </li>
  <li id="q10">
    <div class="Question">Check each item that can be found in our solar system.</div>
    <div class="Answer" style="margin-top: 5px; background: #000; color: #fff; text-align: center;">
    <label for="q10-A"><input type="checkbox" name="q10[]" id="q10-A" value="A">planet</label>
       <label for="q10-B"><input type="checkbox" name="q10[]" id="q10-B" value="B">asteroid</label>
       <label for="q10-C"><input type="checkbox" name="q10[]" id="q10-C" value="C">comet</label>
       <label for="q10-D"><input type="checkbox" name="q10[]" id="q10-D" value="D">black hole</label>
       <label for="q10-E"><input type="checkbox" name="q10[]" id="q10-E" value="E">neutrino star</label>
       <label for="q10-F"><input type="checkbox" name="q10[]" id="q10-F" value="F">quasar</label>
     </div>
      </li>
 </ol>
 <input type="hidden" name="PreviousURL" id="url" />
 <input type="hidden" name="user_token" value="54f3f5438292e" />
 <input type="submit" value="Submit Quiz" />
</form>

2 个答案:

答案 0 :(得分:1)

请查看以下问题的完整解决方案:

<form action="" method="post" id="quiz" onsubmit="return formValidate();">

  <li id="q9">
    <div class="Question">Scientists believe the universe is:</div>
    <div class="Answer">
      <label class="Wide" for="q9-A"><div class="Radio"><input type="radio" name="q9[]" id="q9-A" value="A"> A. disappearing</div></label></div>
    <div class="Answer">
      <label class="Wide" for="q9-B"><div class="Radio"><input type="radio" name="q9[]" id="q9-B" value="B"> B. expanding</div></label></div>
    <div class="Answer">
      <label class="Wide" for="q9-C"><div class="Radio"><input type="radio" name="q9[]" id="q9-C" value="C"> C. contracting</div></label></div>
    <div class="Answer">
      <label class="Wide" for="q9-D"><div class="Radio"><input type="radio" name="q9[]" id="q9-D" value="D"> D. becoming bipolar</div></label></div>
  </li>
  <li id="q10">
    <div class="Question">Check each item that can be found in our solar system.</div>
    <div class="Answer" style="margin-top: 5px; background: #000; color: #fff; text-align: center;">
    <label for="q10-A"><input type="checkbox" name="q10[]" id="q10-A" value="A">planet</label>
       <label for="q10-B"><input type="checkbox" name="q10[]" id="q10-B" value="B">asteroid</label>
       <label for="q10-C"><input type="checkbox" name="q10[]" id="q10-C" value="C">comet</label>
       <label for="q10-D"><input type="checkbox" name="q10[]" id="q10-D" value="D">black hole</label>
       <label for="q10-E"><input type="checkbox" name="q10[]" id="q10-E" value="E">neutrino star</label>
       <label for="q10-F"><input type="checkbox" name="q10[]" id="q10-F" value="F">quasar</label>
     </div>
      </li>
 </ol>
 <input type="hidden" name="PreviousURL" id="url" />
 <input type="hidden" name="user_token" value="54f3f5438292e" />
 <input type="submit" value="Submit Quiz" />
</form>
<script type="text/javascript">
function formValidate(){
    var qno = 2; // Total Questions, say. in your example it's 2 (9 and 10)
    var i = 9; // Question No to start with, say. in your example it's 9
    var qcount = (i+qno)-1;
    for(i; i <= qcount; i++){
        qid = 'q'+i+'[]';
        var qidElement = document.getElementsByName(qid);
        var checkcount = 0;
            for(var j=0; j < qidElement.length; ++j){
                if(qidElement[j].checked){
                    ++checkcount;
                }
            }
            if(checkcount == 0){
                alert("Please select at least one Answer for Question no. "+i);
                return false;
            }
    }
    document.getElementById('quiz').submit();
}
</script>

qno&amp;的输入值i在javascript函数中根据您的要求,在我旁边的相关评论中由我指导。

如果有任何问题,请告诉我。谢谢! :)

答案 1 :(得分:1)

如果您需要强制用户填写所有字段,则必须使用这些验证方法:

1-客户端:通过java脚本,但用户可以通过禁用java脚本“不推荐”来绕过它。

2-服务器端:用户无法禁用它,以及与您的编程语言相关的代码。

3-混合类型:通过Ajax,这是最好的选择

示例

在服务器端检查请求并以JSON类型返回结果。

B-Process通过JavaScript返回数据并以

形式显示结果

检查此链接会对您有所帮助:

http://www.formget.com/form-validation-using-ajax/

http://www.w3schools.com/php/php_form_validation.asp