2012-03-08 8 views
0

これはすばらしいものです。jQueryフォームの検証 - ページ上のすべての選択要素から値を取得し、重複がないことを確認してください

私のページには<select>の要素のリストがあります。これらの各ドロップダウンは、オンラインの親の夜の予約システムの予約時間のリストです。このような

各選択ルックス:

<select class="appointments" id="14" name="appointments[]"> 
    <option>.. Select:</option> 
    <option value="1">[ 4:00 ]</option> 
    <option value="2">[ 4:05 ]</option> 
    <option value="3">[ 4:10 ] Eliza Fox</option> 
    <option value="4">[ 4:15 ]</option> 
    <option value="5">[ 4:20 ]</option> 
    <option value="6">[ 4:25 ] diane davison</option> 
    <option value="7">[ 4:30 ]</option> 
    <option value="8">[ 4:35 ]</option> 
    <option value="9">[ 4:40 ]</option> 
    <option value="10">[ 4:45 ]</option> 
</select> 
予約した人によって

とされていません。 valueの整数は、その時間に特有の予約スロットです。

私は両親が同時に2件の予定を予約することができるようにしたくないので、私は、私はすべての重複があるかどうかを確認、その後、各<select>要素のvalueの配列を取得するためにjQueryを使用することができます考えていました。

重複が見つかった場合は、フォームの送信を停止してalertと表示したいと思います。

それがfalseを返した場合は事前のおかげで、この関数は

+0

も参照してください。http://stackoverflow.com/questions/2419114/using-jquery-how-can-i-check-that-a-collection-of-input-elements-have-unique-va –

答えて

1

私は、これは非常にjQueryのっぽいだろうと思う:

function checkInput() { 
    $selects = $('select'); 
    numSelects = $selects.length; 
    numUnique = $.unique($selects.map(function(){return $(this).val()})).length; 

    if (numUnique < numSelects) { 
     window.alert("Duplicates!"); 
     return false; 
    } 

    return true; 
} 
+1

'$( 'select).filter(function(){....})'のようなものを使用して、' remove '値を持つものを除外します。 –

2

使用し、その後、重複があります。..

function validateTimes(){ 
    var appointmentsArray=[]; 
    $(".appointments").each(function(){  
    if($.inArray($(this).val() , appointmentsArray) > -1){ 
     return false; 
    } 
    }); 
    return true; 
} 
1

これはもう少し複雑ですが、それは時間の重複を確認することですinst value重複のead。これがものになるかどうかに便利知っているが、ここで、あなたは行ってはいけない:

var isDup = function() { 

    var $options = $('select').find('option'), 
     opts = [], 
     dup = false; 

    $options.each(function() { 
     // Regex could be better, matches 99:99 for example... 
     var value = $(this).text().match(/\d+:\d+/); 
     if (!~$.inArray(String(value), opts)) { 
      opts.push(String(value)); 
     } else { 
      dup = true; 
      return false; 
     } 
    }); 

    return dup; 
}; 

あなたはこのhttp://jsfiddle.net/elclanrs/mg734/ようにそれを使用することができます。最後のオプションは、名前が異なっていても時間が重複しているため、isDup = trueが返されます。その最後のオプションを削除してください。isDupfalseになります。

関連する問題