最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Multiple inputs with duplicate value check - Stack Overflow

programmeradmin2浏览0评论

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 ...
});
Share Improve this question edited Jul 18, 2016 at 14:59 ReshaD 9463 gold badges18 silver badges30 bronze badges asked Jul 18, 2016 at 14:29 vcilogluvciloglu 5162 gold badges7 silver badges21 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

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/

发布评论

评论列表(0)

  1. 暂无评论