Home/ Questions/Q 562645
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T12:34:35+00:00

I have five combo boxes. Each one has a different name, but the possible

  • 0

I have five combo boxes. Each one has a different name, but the possible values for each are the same: 1-5. I would like to use Javascript to validate two things:

  1. that each value is selected only once. For example, if the value of “cboCircle” is “1” then the value of “cboSquiggle” cannot be 1, and so on.

  2. that each selected value is used (i.e. that 1, 2, 3, 4, and 5 have all been chosen.)

Essentially, these values are supposed to act as a ranking system for the combo boxes, in a rough sort of way…

Anyone know how I might be able to accomplish this?

NOTE: I’m new to JS. Thanks! 

<head>
<script language="javascript">
function submitSurvey(recID)
{
    var msg = "";

    if ( (document.form.cboCircle.value=="0") || 

(document.form.cboSquiggle.value=="0") ||
 (document.form.cboRectangle.value=="0") || 
(document.form.cboSquare.value=="0") || 
(document.form.cboTriangle.value=="0") )

    {   
        msg += "Please select a value for each combo box.\n";
    }   

    if (msg == "")
    {
        document.getElementById("txtRecID").value = recID;
        form.action = "post.asp";
        form.submit();
    }
    else
    {
        alert (msg);
    }   
}
</script>
</head>

<body>
<form name="form" id="form" method="post">
    <table>
    <table width="99%">
        <tr>
            <td width="29%" bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center"><img name="circle" src="../images/circle.jpg" width="158" height="146" alt=""></p>
            </td>
            <td width="35%" bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center"><img name="squiggle" src="../images/squiggle.jpg" width="204" height="155" alt=""></p>
            </td>
            <td width="36%" bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center"><img name="rectangle" src="../images/rectangle.jpg" width="216" height="122" alt=""></p>
            </td>
        </tr>
        <tr>
            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center">
                <select name="cboCircle" id="cboCircle">
                    <%
                    If RS("shapePrimary") = "Circle" Then   
                    %>
                        <option value="1" selected>1</option>   
                    <%
                    Else
                    %>
                        <option value="0"></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    <%
                    End If          
                    %>
                </select>
                </p>
            </td>   

            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center">
                <select name="cboSquiggle" id="cboSquiggle">
                    <%
                    If RS("shapePrimary") = "Squiggle" Then 
                    %>
                        <option value="1" selected>1</option>   
                    <%
                    Else
                    %>
                        <option value="0"></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    <%
                    End If          
                    %>
                </select>
                </p>    
            </td>

            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center">
                <select name="cboRectangle" id="cboRectangle">
                    <%
                    If RS("shapePrimary") = "Rectangle" Then    
                    %>
                        <option value="1" selected>1</option>   
                    <%
                    Else
                    %>
                        <option value="0"></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    <%
                    End If          
                    %>
                </select>
                </p>
            </td>
        </tr>
        <tr>
            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center"><img name="square" src="../images/square.jpg" width="141" height="143" alt=""></p>
            </td>
            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center"><img src="../images/triangle.jpg" alt="" name="triangle" width="226" height="167" id="triangle2"></p>
            </td>
            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">&nbsp;</td>
        </tr>
        <tr>
            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center">
                <select name="cboSquare" id="cboSquare">
                    <%
                    If RS("shapePrimary") = "Square" Then   
                    %>
                        <option value="1" selected>1</option>   
                    <%
                    Else
                    %>
                        <option value="0"></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    <%
                    End If          
                    %>
                </select>
                </p>
            </td>
            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">
                <p align="center">
                <select name="cboTriangle" id="cboTriangle">
                    <%
                    If RS("shapePrimary") = "Triangle" Then 
                    %>
                        <option value="1" selected>1</option>   
                    <%
                    Else
                    %>
                        <option value="0"></option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    <%
                    End If          
                    %>
                </select>
                </p>
            </td>
            <td bordercolor="#FFFFFF" bgcolor="#FFFFFF">&nbsp;</td>
        </tr>
    </table>
    <p>&nbsp;</p>
    <table width="99%" border="1" cellpadding="0" cellspacing="0" bordercolor="#FFFFFF" class="WebApps">

        <tr>
            <td width="100%">
            <p align="left">
            <input name="btnSubmit" type="button" class="button" id="btnSubmit" value="Submit Survey" onClick="submitSurvey('<%= RS("recID")%>');">
            </p>
            </td>
        </tr>
    </table>
</form>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
    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

    • 0