javascript - Multiple inputs with duplicate value check - Stack Overflow

admin管理员组

文章数量:1332873

I have a button to create input tags. When user click submit button I want to find inputs with duplicate values and change border to red.

I'm not using jquery validate plugin

html code:

<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 code:

// 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 ...
});

I have a button to create input tags. When user click submit button I want to find inputs with duplicate values and change border to red.

I'm not using jquery validate plugin

html code:

<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 code:

// 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 ...
});

• javascript
• jquery
• html

Share Improve this question Follow edited Jul 18, 2016 at 14:59 ReshaD 94633 gold badges1818 silver badges3030 bronze badges asked Jul 18, 2016 at 14:29 vcilogluvciloglu 51622 gold badges77 silver badges2121 bronze badges 4

• Here you go : jsfiddle/karthikvu/x55h0j8m – Karthik VU Commented Jul 18, 2016 at 14:34
• find all input same value, you mean duplicate values? – Zakaria Acharki Commented Jul 18, 2016 at 14:36
• yes duplicate ... sory my english . – vciloglu Commented Jul 18, 2016 at 14:39
• @KarthikVU ups sory. </button> – vciloglu Commented Jul 18, 2016 at 14:41

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

Here is what you want

   $('#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;
    });

If somebody is after this, with a lot of inputs, and is concerned with efficiency, this yields the same result (duplicates besides the first occurrence are marked):

$('#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
      }
    }
  );
});

fiddle:

https://jsfiddle/4s82L4vg/

本文标签： javascriptMultiple inputs with duplicate value checkStack Overflow