How to check duplicate value in inputs using jQuery

Question

I have a html table and there is input in it. I want to check duplicate value in a custom column or In the other hand Non Dupllicated td value.

<table>
    <tr><td><input value="one"/></td></tr>
    <tr><td><input value="two"/></td></tr>
    <tr><td><input value="one"/></td></tr>
    <tr><td><input value="nine"/></td></tr>
    <tr><td><input value="four"/></td></tr>
</table>

I want check all input in td and if a value duplicated display error. For example in top code one is duplicated. I don't want to use for().

stackoverflow.com/questions/37749385/…

Midas
– Midas

2016-06-12 12:21:59 +00:00
Commented Jun 12, 2016 at 12:21 — Midas
– Midas, Commented Jun 12, 2016 at 12:21

Mohammad · Accepted Answer · 2016-06-12 11:49:31Z

18

Using each() check value of inputs and if any value is duplicate add class duplicate to it.

var arr = [];
$("input").each(function(){
    var value = $(this).val();
    if (arr.indexOf(value) == -1)
        arr.push(value);
    else
        $(this).addClass("duplicate");
});

.duplicate {
    border: 1px solid red;
    color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tr><td><input value="one"></td></tr>
    <tr><td><input value="two"></td></tr>
    <tr><td><input value="one"></td></tr>
    <tr><td><input value="nine"></td></tr>
    <tr><td><input value="four"></td></tr>
    <tr><td><input value="four"></td></tr>
</table>

edited Jun 12, 2016 at 11:49

answered Jun 12, 2016 at 11:14

Mohammad

21.5k16 gold badges58 silver badges86 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Mohsen Zahedi Over a year ago

I don't want make a distinct table ,I want that exist duplicate value has error

Mohammad Over a year ago

@MohsenZahedi Write your opinion about my answer.

Mohammad Over a year ago

@MohsenZahedi What is meaning of not work? In snippet or in your local?

Purushotam Thakur · Accepted Answer · 2016-06-12 12:11:51Z

4

Try this one

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <table>
        <tr><td><input value="one"></td></tr>
        <tr><td><input value="two"></td></tr>
        <tr><td><input value="one"></td></tr>
        <tr><td><input value="nine"></td></tr>
        <tr><td><input value="four"></td></tr>
    </table>

<script>
$("input").change(function(){
    var x=$(this).val();
    var z=0;
    $("input").each(function(){
        var y=$(this).val();
        if(x==y){
            z=z+1;
        }
    });
    if(z>1){
        alert(x);
    }
 })
 </script>

 </body>
</html>

answered Jun 12, 2016 at 12:11

Purushotam Thakur

48910 silver badges17 bronze badges

Comments

Jayakumar Thangavel · Accepted Answer · 2019-11-18 09:01:14Z

0

Please check using this code

$("input").on("change",function(){
   var arr = new Array();
   $("input").each(function(){
                        arr.push($(this).val());
   });
   for(var i=0; i<arr.length;i++){
       for(var j=i+1;j<arr.length;j++){
          if(arr[i]==arr[j]){
              alert("Already Exist"); 
              return;
          }
       }
   }         
})

edited Nov 18, 2019 at 9:01

Jayakumar Thangavel

2,0331 gold badge24 silver badges29 bronze badges

answered Nov 18, 2019 at 7:46

kamran khan

1

1 Comment

CodeGuru Over a year ago

It will be bit helpful if you can give small description about you approach.

Chris Singleton · Accepted Answer · 2022-09-06 21:34:27Z

I used JQuery to check two columns on duplicates, starting off by hiding rows that do not contain:

     $("#webGrid tr > td.TrailerNumber:not(:contains('" + CurrentTrailerNumber 
 + 
 "'))").parent().hide(); //Hide rows on TrailerNumber that don't match.
            $("#webGrid tr > td #CarrierNameLbl:not(:contains('" + 
 CurrentCarrrierNameLbl + "'))").parent().closest('TR').hide(); //Hide Rows 
 that don't contain value.

You can also test the length of strings to validate:

 //Test lengths to determine if an exact match. 
            if ($('#webGrid tbody > tr > td #TrailerNumber').val().length > TrailerNumberLength || $('#webGrid tbody > tr > td #TrailerNumber').val().length != TrailerNumberLength) {
                $('#webGrid TR').parent().closest('TR').hide();
            };

            if ($('#webGrid tbody > tr > td #CarrierName').val().length > CurrentCarrierNameLength || $('#webGrid tbody > tr > td #CarrierName').val().length != CurrentCarrierNameLength) {
                $('#webGrid TR').parent().closest('TR').hide();
            };

Collectives™ on Stack Overflow

How to check duplicate value in inputs using jQuery

4 Answers 4

3 Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related