2013-01-20 53 views
-3

我有一個接觸的形式。它要求你的名字,然後問你是否願意通過電話或電子郵件聯繫。電話和電子郵件字段是隱藏的,除非用戶選擇電話或電子郵件的單選按鈕。一旦你點擊任何電話或電子郵件我確認他們是否輸入正確的電話或電子郵件地址。如何驗證表單時兩個必填字段中只有一個被填充

我的問題是如何檢查與jQuery驗證並打印出一條錯誤消息,如果用戶沒有在任單選按鈕點擊?

+0

你會需要展示一些東西......我建議從'.validate()'函數爲初學者提供表單的HTML和jQuery。 – Sparky

回答

1

你只是詢問如何驗證一組單選按鈕的?既然你已經證明沒有代碼,所有我可以告訴你的是,你將如何驗證一套radioinput的用插件。

,那麼你會動態地添加/使用built-in rules method從相應的輸入移除規則。再次,我需要在定製解決方案之前查看您的代碼。

工作演示http://jsfiddle.net/PbHwX/

jQuery的

$(document).ready(function() { 

    $('#myform').validate({ 
     rules: { 
      radiotest: { 
       required: true 
      } 
     }, 
     messages: { 
      radiotest: { 
       required: "please select at least one option" 
      } 
     } 
    }); 

}); 

HTML

<input type="radio" name="radiotest" value="0" /> 
<input type="radio" name="radiotest" value="1" /> 

文檔http://docs.jquery.com/Plugins/Validation

0

更新(2012-01-20 19:38): 我想我明白你正在尋找,發現你想要使用jQuery的驗證插件。

這裏是的jsfiddle 一個working Demo(注:我從斯帕克的小提琴分叉)

默認情況下,只有關於單選按鈕的規則設置。所有的消息都是預先設置的,並且表單的特定字段是隱藏的。現在只要點擊一個單選按鈕,我隱藏無用場,刪除相應的規則。我還顯示正確的字段並添加相應的規則。

特定的代碼塊你要找的人必須是這樣的:

/* Toggle fields */ 
    $('#mailfields').hide(); 
    $('#phonefields').show(); 

    /* Remove email rule */ 
    $('input:text[name=emailadress]').rules('remove'); 

    /* Add a requirement rule for phone */ 
    $('input:text[name=phonenumber]').rules('add', { required: true }); 

第一個答案:你說,當用戶選擇兩個無線電中的一個(電子郵件或電話) ,您顯示一個或另一個相應的字段。因此,我認爲你已經有了它運行在用戶每次點擊一個單選按鈕一段jQuery代碼。

這段代碼可以添加一個類或一個隱藏的字段或任何你喜歡的東西(或任何這種情況下的最佳常見做法,我很遺憾沒有足夠的經驗知道......),它讓你後來知道用戶確實選擇了一個選項。

如果可以顯示更多的代碼(例如一個jsFiddle)的,我可以給你一個更具體的答案。不過,這裏是我會做什麼:

  1. 的形式爲各領域
  2. 隱藏/顯示領域,只要你想用jQuery的HTML文件和CSS已經在
  3. 測試始終是相同的:

    (phoneRadio.selected && phoneField.filled) 
    || (mailRadio.selected && mailField.filled) 
    

讓我知道如何幫助。

+0

好的我在這裏粘貼了我的驗證代碼:http://jsfiddle.net/LyVRS/。我的問題是如何將邏輯添加到「驗證」功能中。我想做一些類似'if(!email &&!telephone){print error}'。 – mikeglaz

+0

@mikeglaz,請將您的代碼添加到您的原始發佈中,以便每個人都可以看到它,並且在鏈接失效後問題仍然有用。另外,你的HTML? – Sparky

-1

,你可以,如果你有很多形式使用jquery不顯眼,並使用ASP.NET MVC等等。 或者你可以做這樣的事情:

Demo

$('#form').click(function (e) { // or $form.submit handler 
    if ($('#email').val() == "") // or you can use an regex validation 
    { 
     e.preventDefault(); 
     // set message here 
     $('#message').css('color', 'red').append('email invalid !'); 
    } 
}); 

$('form').submit(function (e) { 
    alert('submited :' + $('#email').val()); 
}); 
+0

OP在哪裏說他在使用ASP.NET MVC等?因爲,否則他肯定不需要使用'unobtrusive.js'。 – Sparky

+0

我說**如果**男子 –

+0

你只應該在這裏發佈_relevant answers_,而不是假設情景。 [你的jsFiddle演示也被破壞](http://jsfiddle.net/OlivierAlbertini/9ma3u/)...它被設置爲'Mootools',不包含'radio'輸入,不包含插件,因此什麼都不做。 – Sparky

相關問題