Pfthb

How can I compare multiple input field values and if there is a match alert 'There are similar values' using jQuery?

<input value="111"> //similar
<input value="222">
<input value="111"> //similar
<input value="333">

This html code above should alert 'There are similar values', as it has 2 values which are the same. How can it be done with jQuery?

My tried(Following code doesn't work):

DEMO: http://jsfiddle.net/HpWLQ/

$('input').each(function () 
 var $this = $(this);
 var val = $this.val();
 vals.push(val);
);
for (var i = 0; i < vals.length; i++) 
 for (var n = 0; n < vals.length; n++) 
 if (n !== i) 
 if (vals[i] === vals[n]) 
 alert('There are similar values');
 
 
 

Edit: In order to satisfy @Raynos, here's a pure JS solution.

var vals = ;
var flag = false;
var collection = document.getElementsByTagName('input');
collection = .slice.call(collection);

collection.forEach(function(element, index, array) 
 if (flag === true) return;
 var i = element.value;
 if (vals[i])
 
 flag = true;
 alert('There are duplicates!');
 
 else
 
 vals[i] = 1;
 
);

​

Bonus: I ran my solutions through jsperf; the last one is obviously by far the fastest.

Edit: Here's what would probably be the jQuery way of solving your problem (Working fiddle here). My original answer remains below.

var duplicatefound = false;
$('input').each(function(index, item)
 if (duplicatefound) return;
 val = $(item).val();
 if ($('input[value="' + val + '"]').length == 1) return;
 duplicatefound = true;
 alert('There are similar values');
);

​
Alternative solution in case you need to capture some or all of the duplicate values (Working fiddle here):

var collection = $('input');
var duplicates = $.map(collection, function(item)
 val = $(item).val();
 return ($('input[value="' + val + '"]').length > 1) ? val : null;
);

if(duplicates.length > 0) alert('There are similar values');

As others have mentioned, you were missing a declaration of vals as an array, therefore, .push() was failing.

You might find an object based solution to be more elegant: Working fiddle

var vals = ;

$('input').each(function() 
 var index = $(this).val();
 if (vals[index])
 
 vals[index]++
 
 else
 
 vals[index] = 1;
 
);

var duplicates = $.map(vals, function(val, key)
 return (val > 1) ? key : null;
);

if (duplicates.length > 0) alert('There are duplicates!');

You haven't defined the vals to be an array. You can define it like

vals = ;

Demo

EDITED 2: 

function findDuplicates()

 var dupCount = 0;
 $('input').each(function () 
 var $currentInput = $(this);
 $('input').each(function () 
 if($(this).val() == $currentInput.val() && $(this) != $currentInput)
 dupCount++;
 );
 );
 if(dupCount > 0) alert("There are " + dupCount + "duplicates!");

var inputs = $("input"), similar = , i, j;

for (i = 0; i < inputs.length; i += 1) 
 for (j = i + 1; j < inputs.length; j += 1) 
 if (inputs[i].value === inputs[j].value) 
 similar.push([i,j]);
 
 


if (similar.length > 0) 
 alert('There are similar values');
​

Note that the this only compares unique permutations in order, and it gives you an array of matching indices in the similar array, in case this is interesting to you.

Example: http://jsfiddle.net/sjCGy/

You could just as easily remove the jQuery dependency using document.getElementsByTagName instead of the jQuery selector.

And since @Raynos can't read, I'll make it explicit.

var inputs = document.getElementsByTagName("input"), similar = , i, j;

for (i = 0; i < inputs.length; i += 1) 
 for (j = i + 1; j < inputs.length; j += 1) 
 if (inputs[i].value === inputs[j].value) 
 similar.push([i,j]);
 
 


if (similar.length > 0) 
 alert('There are similar values');
​

Your code works, you are just missing the declaration of the vals array - See updated fiddle