1

If I have multiple textboxes which have different ID's but all id's start with 'pics' preceeded by a number. so:

textbox1  id = 'pics1' value='test1'
textbox2  id = 'pics2' value='test2'
textbox3  id = 'pics3' value='test1'
...
submit

I want to do some validation that when the user clicks submit..there are no two values in the textboxes that are same. For the above example, validation will result in error and form wont submit. because pics1 and pics3 have same values.

5 Answers 5

2

One solution (not tested):

function validate() {

   var isValid = true;

   $("input:text[id^=pics]").each(function() {
      if ($("input:text[id^=pics][value=" + $(this).val() + "]").length > 1)
        isValid = false;
      });

   return isValid;
}
Sign up to request clarification or add additional context in comments.

Comments

1

This will work for however many text inputs that you have

function validate()  {
  var inputs = $('input:text[id^="pics"]');
  var values = $.map(inputs, function(n, i) {
      return n.value;
  });

  values = unique(values);

  return values.length === inputs.length;
}

function unique(arr) {
  var r = [];
  o:for(var i = 0, n = arr.length; i < n; i++) {
    for(var x = i + 1 ; x < n; x++) {
       if(arr[x]==arr[i]) continue o;
    }
    r[r.length] = arr[i];
  }
  return r;
}

6 Comments

thanks. I was trying out your code but var inputs returns false in the following debug of your code. var inputs = $('input:text[id^="pics"]'); alert('here1 : ' + inputs);
@josh - take a look here jsbin.com/ivigo . add /edit to the url if you want to see the code
One thing to bear in mind - At the moment this solution does not require a value in each element. If one value is an empty string, it will still validate to true. Is this acceptable?
yes. that is fine. thanks! your solution def. works on jsbin. but for some odd reason if i take same code as jsbin and put iton the server (where I am testing) it does not work. Guess I need to figure that outmyesef. thanks again
please take a look once why it is not working. everything looks alright to me! unless some server setting stops jquery?? lorigrahamdesign.com.previewdns.com/admin/test1.html
|
1

I had to highlight the drop down boxes(select elements) which contains the same values(selected value).

So I just changed a few things.

function validate()  {
  var inputs = $('select[id^="select_style"]');
  var values = $.map(inputs, function(n, i) {
      if(n!=undefined)
      return n.value+'-'+n.id;
  });

   values = unique(values);

   for(si=0;si< values.length;si++)
    {
    jQuery('#'+values[si]).css('background-color','#ff0000')
     }


}

//I changed unique function a bit, now it will return an array containing ids of

//elements which contains same values

function unique(arr) 
{
        //arr contains array of  value1-id1,value2-id2,value3-id3....    
    var arrId=new Array();
    var arr1=new Array();
    var dIdArr=new Array();//dIdArr  array containing ids of elements which contains 
                               //duplicate values

  for(j=0;j< arr.length;j++)
     {
      var sa=arr[j].split('-');
         arr1[j]=sa[0]; 
         arrId[j]=sa[1];
      }
  var r = [],l=0;

  o:for(var i = 0, n = arr.length; i < n; i++) 
{
    for(var x = i + 1 ; x < n; x++)
 {
       if(arr1[x]==arr1[i])
         {
if(jQuery.inArray(arrId[x],dIdArr)==-1)//not found in the array 
                                       //then assign in the array
             { 
dIdArr[l]=arrId[x];
                 l++;
                  if(jQuery.inArray(arrId[i],dIdArr)==-1)
                  {
                 dIdArr[l]= arrId[i];l++;}
                 }
                 else if(jQuery.inArray(arrId[i],dIdArr)==-1){
                      dIdArr[l]=arrId[i];
                      l++;
                     } 
         continue o;
         }
    }
    r[r.length] = arr1[i];
  }
return dIdArr;

}

Comments

0

Try this:

<script>
function validate()
{
    var areas = document.getElementsByTag('textarea');
    for (var i=0; i<areas.count;i++)
        for (var j=i+1; j<areas.count;i++)
            if (areas[i].id.startsWith('pics') && areas[i].id.startsWith('pics') && areas[i].value == areas[j].value)
                return false;
    return true
}
</script>

<form onsubmit="return validate();">
    <textarea id = 'pics1'></textarea>
    <textarea id = 'pics2'></textarea>
    <textarea id = 'pics3'></textarea>
    <input type="submit" />
</form>

1 Comment

this is not good as I will have to create a var for each element
0
<form onsubmit="return validate()" >
<input type="text" id="pics1" value="test1" />
<input type="text" id="pics2" value="test2" />
<input type="text" id="pics3" value="test3" />
<input type="submit" />
<br/><label id="error" />
</form>
<script>
function validate(){
    var inputs=document.getElementsByTagName("input");
    var pics1_temp,pics3_temp;
    for (var i=0;i<inputs.length;i++){
        if(inputs[i].id.indexOf("pics")>-1)
        {
            if(inputs[i].id=="pics1")
                pics1_temp=inputs[i].value;
            else if(inputs[i].id=="pics3")
                pics3_temp=inputs[i].value;
        }
    }

    if(pics1_temp!=pics3_temp)
    {
        document.getElementById("error").innerHTML="Pic1 must match with pic3";
        return false;
    }
    else return true;
}
</script>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.