javascript multiple input textbox validation

Question

I have 'n' number of textbox on a form, after the user enters a value in a textbox, i need to validate its not a duplicate in the other textboxes.

Ex :

Textbox[0] : 1
Textbox[1] : 2 
Textbox[2] : 3
Textbox[4] : 1

For this example it should alert saying that '1' have entered twice. Let me know what to be done.

Answer 1

If you already have the textboxes in an array, loop through the array and look for duplicate values. This is not the most efficient way (it's O(n²) to compute) to solve the problem (a dictionary would be better), but for a small number of text boxes it is the simplest.

function TestForDuplicates( var Textboxes )
{
    for( tb in Textboxes )
    {
        for( tb2 in Textboxes )
        {
            if( tb != tb2 ) // ignore the same textbox...
            {
                if( tb.value == tb2.value )
                    alert( "The value " + tb.value + " appears more than once." );
            }
        }
    }
}

If you have more than about 10 textboxes in your array, an alternative approach is to build a mapping of how many times each value appears:

function FindDuplicates( var Textboxes )
{
    var valueList = new Array();

    for( tb in Textboxes )
        valueList.push( tb.value );        

    valueList.sort(); // sort values so that duplicates are adjacent

    if( valueList.length > 1 ) 
    {
        for( i = 0; i < valueList.length-1; i++ )
             if( valueList[i] == valueList[i+1] )
                 alert( "The value " + valueList[i] + " appears more than once." );
    }
}

Answer 2

function testValues ()
{

    var inputs = document.getElementsByTagName ("input");

    var answers= new Array();

    for(var ii = 0; ii < inputs.length; ii++)
    {
       if(inputs[ii].type == 'text')
     {

        for(var jj = 0; jj < answers.length; jj++)
        {
           if(answers[jj] == inputs[ii].value)
              return false;
        }

          answers.push(inputs[ii].value);
     }



    }

return true;

}

Answer 3

Assuming you have code to read in the textboxes and store them in an array

var validator = function(textbox){
  var values = [];
  for(i=0;i<textbox.length;i+=1){
    if (values.indexOf(textbox[i]) === -1){
     values[i] = textbox[i];
   }else{
      return false;
   }
  }
  return true;
}

That should be very performant as it only goes until it finds a duplicate

Answer 4

This is pretty easy using a PrototypeJS Hash object.

 function validate() {
      var textVals = new Hash();
      $$('input[type=text]').each( function(elem) {
          if(textVals.get(elem.value) == undefined) {
              textVals.set(elem.value, elem.id);
          }else {
              alert('Duplicate text value found (' + elem.id + '=' + textVals.get(elem.value) + ')');
          }
      });
  }

This function iterates over all text inputs on the current page. If a value has never been seen before, it gets saved to the hash. If the value is already in the hash, we have a duplicate.

In this example, it displays the ids of the two elements with duplicate values.