2016-07-18 13 views
-1

入力タグを作成するためのボタンがあります。ユーザーが送信ボタンをクリックすると、重複した値を持つ入力を見つけて、境界線を赤に変更したいと考えています。重複値チェックの複数の入力

私は

HTMLコードjqueryの検証プラグインを使用していないよ:

<form> 
<table> 
    <tr> 
    <td><input type="text" name="text[]" id="1"> <button class="add">add</button></td> 
    </tr> 
</table> 
<input type="submit" id="submit" value="check"> 
</form> 

のjQueryコード:

// add input 
var i = 2; 

$('.add').click(function(e){ 
    e.preventDefault(); 
    $('table').append("<tr><td><input type="text" name="text[]" id="'+i+'"> <button class="add"></td></tr>"); 
    i++; 
}); 

$('#submit').click(function(){ 
    // I do not know how to write ... 
}); 
+0

ここに行きます:https://jsfiddle.net/karthikvu/x55h0j8m/ –

+0

すべてが同じ値を入力したことを知っていますか?重複する値を意味しますか? –

+0

はい重複しています... sory my english。 – vulkan

答えて

3

ここではあなたが

何をしたいです
$('#submit').click(function() { 
     var valid = true; 

     $.each($('input[type="text"]'), function (index1, item1) { 

      $.each($('input[type="text"]').not(this), function (index2, item2) { 

       if ($(item1).val() == $(item2).val()) { 
        $(item1).css("border-color", "red"); 
        valid = false; 
       } 

      }); 
     }); 

     return valid; 
    }); 
+0

非常にいいです。ありがとう。その非常に良い仕事。まさに私が望む通り – vulkan

2

誰かが入力の多くで、この後で、かつ効率的に懸念されている場合は、これは同じ結果(最初に出現した以外の重複がマークされている)が得られる:

$('#submit').click(function(){ 
    var values = []; //list of different values 
    $('table input:text').each(
    function() { 
     if (values.indexOf(this.value) >= 0) { //if this value is already in the list, marks 
     $(this).css("border-color", "red"); 
     } else { 
     $(this).css("border-color", ""); //clears since last check 
     values.push(this.value); //insert new value in the list 
     } 
    } 
); 
}); 

フィドル:

https://jsfiddle.net/4s82L4vg/

+0

これも使うことができます。しかし、Jawad Umarはもっと便利です。あなたの興味のためにありがとう – vulkan

+0

これは1つだけのループを持っているので、これはより効率的です。 – jayadevkv

関連する問題