JQuery驗證與多組單選按鈕

我有一個form確實提交了8個radio按鈕中的1個到php$_POST超全局數組。因此，我需要一些驗證。我是好心通過提供這個代碼的偉大工程幫助：JQuery驗證與多組單選按鈕

$("#form").submit(function (event) { 

      if(!$(":radio:checked").length) { 

      alert("You must select at least one emotional state!"); 
      event.preventDefault(); 

      } 
     });

不過，我現在已經被要求有2套，其中用戶選擇2分的答案，而不是最初的1個回答8個radio按鈕。我需要代碼才能確定在提交表單之前，已從每組8個按鈕中選擇了至少一個radio按鈕。代碼檢查是否有radio按鈕被選中，然後只要選擇了1個按鈕，該功能即被滿足並轉換到下一頁，這不是我想要的。

編輯

按鈕代碼：

<p><input type="radio" value="happy" name="perceived_emotion">Happy 
<input type="radio" value="excited" name="perceived_emotion">Excited 
<input type="radio" value="angry" name="perceived_emotion">Angry 
<input type="radio" value="frustrated" name="perceived_emotion">Frustrated 
<input type="radio" value="miserable" name="perceived_emotion">Miserable 
<input type="radio" value="sad" name="perceived_emotion">Sad 
<input type="radio" value="tired" name="perceived_emotion">Tired 
<input type="radio" value="relaxed" name="perceived_emotion">Relaxed</p> 

<p><input type="radio" value="happy" name="induced_emotion">Happy 
<input type="radio" value="excited" name="induced_emotion">Excited 
<input type="radio" value="angry" name="induced_emotion">Angry 
<input type="radio" value="frustrated" name="induced_emotion">Frustrated 
<input type="radio" value="miserable" name="induced_emotion">Miserable 
<input type="radio" value="sad" name="induced_emotion">Sad 
<input type="radio" value="tired" name="induced_emotion">Tired 
<input type="radio" value="relaxed" name="induced_emotion">Relaxed</p>

這裏是form代碼：

<form id="form" action="audio_handler.php?id=1" method="POST"> 

       <div id="perceived_emotions"> 
       <?php include("includes/induced_emotion_buttons.php"); ?>  
       </div> 

       <br /> 

       <div id="induced_emotions"> 
       <?php include("includes/perceived_emotion_buttons.php"); ?> 
       </div> 

       <p class="right"><input type="submit" name="submit" value="Submit"></p> 

      </form>

來源

2014-11-24 user1574598

我們需要更多的代碼，例如：radio：checked來自哪裏？請在頁面上顯示HTML和任何其他javascript/jquery：D – 2014-11-24 21:54:55

現在就編輯我的帖子。 – user1574598 2014-11-24 21:59:37

首先，您需要將單選按鈕轉換爲複選框。 – 2014-11-24 22:13:55

你想要做的是結合:checked選擇使用的JQuery的[name="value"]選擇什麼。所以你的新代碼將是：

if(!$('input[name="perceived_emotion"]:checked').length) { 
    alert("You must select at least one perceived emotional state!"); 
    event.preventDefault(); 
    return false; 
} 

if(!$('input[name="induced_emotion"]:checked').length) { 
    alert("You must select at least one induced emotional state!"); 
    event.preventDefault(); 
    return false; 
}

所有這些包裹到表單事件。

編輯：由於您只想一次顯示一個對話框，只需在每個if語句中添加return false;即可。

來源

2014-11-24 22:20:46

優秀:-)謝謝，工作一種享受。但是，我可能會將兩個單獨的對話框實際出現在網頁上，因爲彈出兩次的警報框令人煩惱。請注意，我希望用戶在每個頁面上完成每個問題，因此根本沒有消息彈出！ – user1574598 2014-11-24 22:35:29

@ user1574598看看我的編輯。 – 2014-11-24 22:37:34

我看到 - 我在閱讀JQuery網站後認爲'return false'等於'event.preventDefault（）;'？再次感謝，我將在早上嘗試它，因爲我現在已經關閉了所有的東西。 – user1574598 2014-11-24 22:45:43

JQuery驗證與多組單選按鈕

回答

相關問題