ansaurus

Question

Javascript: Validate that each combo box selection is unique

Answer 1

A:

This would probably be better handled with radio buttons than combo boxes. You'd have to reverse the way you are thinking about the problem (for each ranking, select a value instead of selecting a ranking for each value), but it better fits what you are trying to do.

noah 2010-01-13 19:46:08

Answer 2

+1 A:

function checkThem(){ //returns true or false - your caller can do the alert/submit
  var cbNames = ["cboCircle","cboSquiggle","cboRectangle","cboSquare","cboTriangle"];
  var valsTaken = [];
  for (var i = 0; i < cbNames.length; i++) {
    var idx = document.form[cbNames[i]].selectedIndex;
    if (idx == 0 || valsTaken[idx]) return false; //not selected or already found
    valsTaken[idx] = true;
  }
  return true; //if we got to here, all is right with the world....
}

I'm sure there are other (possibly simpler) ways to do this, but the above should work... All it's doing is keeping a record of whether something has already been selected, in valsTaken and returning false if it's already been taken or is 0

Edit: original poster wants separate messages depending on selected/not selected. Try this:

function checkThem(){ //returns {unselected: i} or {selectedTwice: idx}
  var cbNames = ["cboCircle","cboSquiggle","cboRectangle","cboSquare","cboTriangle"];
  var valsTaken = [];
  for (var i = 0; i < cbNames.length; i++) {
    var idx = document.form[cbNames[i]].selectedIndex;
    if (idx == 0) return { unselected: cbNames[i] };
    if (valsTaken[idx]) return {  selectedTwice: idx }; 
    valsTaken[idx] = true;
  }
  return {ok: true}; //if we got to here, all is right with the world....
}

var rsltObj = checkThem();
if (rsltObj.unselected) {
  alert(rsltObj.unselected + " not selected");
} else if (rsltObj.selectedTwice) {
  alert(rsltObj.selectedTwice + " has been selected twice");
} else {
  alert("Ok");
}

Please note that this second example is probably not the best code - I've just done this as quickly as I could

Graza 2010-01-13 20:41:09

thanks. i'm new to JS. i put this in my code and called it inside of my submitSurvey() function, but how do I get it to give me a message if the selected value has been taken?

baldwingrand 2010-01-13 21:39:32

Ah, ok, you need a separate message for not-selected and selected-twice? I'll edit the code.

Graza 2010-01-13 21:56:48

this is doing the trick for the most part. the only trouble i'm still running into is that when this page loads, there is already a "1" value populated in one of the combo boxes (from the database). the javascript doesn't seem to recognize that the value is there. but that could be bad asp writing on my part. (for example, starting with this line: <% If RS("shapePrimary") = "Triangle" Then %>

baldwingrand 2010-01-14 16:37:05

I'm not really an expert on ASP - it would be best if you loaded your page in a browser, choose "view source", then inspected the html that was being output, and perhaps post a *relevant excerpt* of it here (i.e. just the select/option parts)

Graza 2010-01-14 18:03:11

Actually, I see the problem there - in that case, there are no other options in the select box, so value 1 would be index 0. My script is looking for index rather than value. Are you sure your ASP is correct - it seems to me that when something comes from the database you are not allowing the user to change this (there are no other options in the select box) - is this correct? If this is the way it is supposed to behave, the javascript needs to change, otherwise it's an ASP issue

Graza 2010-01-14 18:15:16

ahhh. ok. i put "0" as an option value in front of the selected "1" value. Now it's recognizing my values. Thank you so much!

baldwingrand 2010-01-15 16:59:03

Answer 3

+1 A:

Hi there. I improved a bit your code for easier future changes and added function which will compare if values are the same in combo boxes or not.

Two differences: First one. The function which checks your comboboxes for 0, now supports also empty value. Imagine you would like to change your captions of the options in the to the '' instead of 0.

The second change is that, isTwice function not only checks for numbers, but it compares strings. It is made for the same reason. In case you would like to check if there some option with the same word selected twice.

function isEmpty(nodes){
   for(var i=0; i<nodes.length; i++){
       var node = nodes[i];
       var option = node.options[node.selectedIndex];
       if(!option.value){
           return true; 
       }
   }
   return false;
}

function isTwice(nodes){
   var map = {}; 
   for(var i=0; i<nodes.length; i++){
       var node = nodes[i];
       var option = node.options[node.selectedIndex];
       var value = option.value;
       if(map[value]){
           return true;
       }
       map[value] = true;
    }
    return false;
}

function getNodesByIds(ids){
    var result = [];
    for(var i=0; i< ids.length; i++){
        var node = document.getElementById(ids[i]);
        node && (result.push(node)); 
    } 
    return result;
}

function submitSurvey(recID){
    var nodes = getNodesByIds([
        "cboCircle",
        "cboSquiggle",
        "cboRectangle",
        "cboSquare",
        "cboTriangle"
    ]);

    if(isEmpty(nodes)){
        alert("Please select a value for each combo box.");
    }else if(isTwice(nodes)){
        alert("Values of the combo boxes should not be the same");
    }else{
        var form    = document.getElementById("form");
        var txtNode = document.getElementById("txtRecID").

        txtNode.value = recID;
        form.action = "post.asp";

        form.submit();
    }
}

nemisj 2010-01-13 22:38:20

thanks. this code doesn't seem to recognize that i have values in my combo boxes though. do i need to modify my option values to get this to work? i took all my surrounding ASP out of the equation, and then gave every combo box a value, but it's still alerting me to select a value for each combo box.

baldwingrand 2010-01-14 16:43:47

There was small typo. I've fixed that, should work now.

nemisj 2010-01-15 07:55:08

unfortunately, still couldn't get this one to work..

baldwingrand 2010-01-15 17:01:34

ansaurus

tags:

views:

answers:

Javascript: Validate that each combo box selection is unique

related questions