2016-05-24 2 views
0

На этой странице моего проекта отображается список вопросов, хранящихся в базе данных. Пользователь должен выбрать 10 вопросов, а затем нажать кнопку, чтобы пройти викторину. Я могу ограничить выбор флажка до 10 вопросов, а также обеспечить выбор не менее 10 вопросов. Если пользователь выбрал 5 вопросов, например, появляется предупреждение, информирующее пользователя о необходимости выбора 10 вопросов, но затем форма направляется в свое местоположение «действие». Как я могу остановить отправку формы, если выбрано менее 10 вопросов? Вот мой код ...Как остановить отправку и оповестить пользователя о том, что менее 10 вопросов выбраны с помощью JS

<?php 
    session_start(); 

    // Insert header 
    if ('Header.php') { 
     include 'Header.php'; 
    } else { 
     echo "The file was not found"; 
    } 

    // Define database info 
    $username = ""; 
    $password = ""; 
    $servername = "localhost"; 

    // Connect to database and display all 
    // questions with check boxes to allow user 
    // to select a max of 10 questions. 
    try { 
     $pdo = new PDO("mysql:host=$servername; dbname=Quizes", $username, $password); 
     // Set the PDO error mode to exception 
     $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); 

     // Query to select all questions 
     $sql_selectQuestions = "SELECT * FROM QuestionTable"; 
     $result_selectQuestions = $pdo->query($sql_selectQuestions); 
     $questionList = $result_selectQuestions->fetchAll(); 


    } catch (PDOException $e) { 
     echo "Connection failed: " . $e->getMessage(); 
    } 
?> 

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Question Selection</title> 
     <script type="text/javascript"> 

     chkcontrol = function(j) { 
      var total = 0; 
      var questions = document.getElementsByName('questions[]'); 
      for (var i = 0; i < questions.length; i++) { 
       if (questions[i].checked) { 
        total = total + 1; 
       } 
       if (total > 10) { 
        alert("Please select only 10 questions"); 
        questions[i].checked = false; 
        return false; 
       } 
      } 
     } 

     chkmin = function() { 
      var total; 
      var questions = document.getElementsByName('questions[]'); 
      for (var i = 0; i < questions.length; i++) { 
       if (questions[i].checked) { 
        total = total + 1; 
       } 
       if (total < 10) { 
        alert("Please select 10 questions"); 
        return false; 
       } 
      } 
     } 

     </script> 
    </head> 
    <body> 
     <?php echo "<br />"; ?> 
     <form id="questionselect" name="questions" action="ChooseQuizTime.php" method="post"> 
      <table border="2" style="margin:0 auto; padding:5px"> 
       <thead> 
        <tr> 
         <th>Question Number</th> 
         <th>Questions</th> 
         <th>Include in Quiz</th> 
        </tr> 
       </thead> 
       <tbody> 
        <?php 
         // Print a row for each record in the returned query 
         foreach($questionList as $key => $row) 
         { 
          echo " 
           <tr> 
            <td style='text-align:left;'>$row[questionId]</td> 
            <td style='text-align:left;'>$row[questionText]</td> 
            <td style='text-align:center;'><input type='checkbox' name='questions[]' onclick='chkcontrol($count)' value='$row[questionId]' /></td> 
           </tr>"; 
         } 
        ?> 
       </tbody> 
      </table> 
      <div align="center"> 
       <br /> 
       <input type="submit" value="Take Quiz" onclick="chkmin()" /> 
      </div> 
     </form> 
    </body> 
</html> 

ответ

2

Try с формы в onsubmit собственности:

<form id="questionselect" name="questions" action="ChooseQuizTime.php" method="post" onsubmit="return chkmin($count);"> 
+1

Я не баловался в чистом JS в некоторое время, но не должен 'onsubmit' слушателем быть на '

' tag? – MonkeyZeus

+0

@MonkeyZeus - ты прав, я думаю, что сон - я обновил свой ответ. Thx для упоминания –

+0

Нет пота, мы все были там в какой-то момент – MonkeyZeus

Смежные вопросы