Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Aug 2005
    Posts
    252
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Requiring a selection from a drop down box

    How can I force the user to choose one of the four?

    <select name="product">
    <option selected>Please choose...</option>
    <option>product 01</option>
    <option>product 02</option>
    <option>product 03</option>
    <option>product 04</option>
    </select>

    Thanks!

  • #2
    Regular Coder
    Join Date
    Jun 2006
    Posts
    225
    Thanks
    6
    Thanked 3 Times in 3 Posts
    Drop-down boxes will always have at least on option selected, so I'm not quite sure what you mean?

  • #3
    Regular Coder
    Join Date
    Aug 2005
    Posts
    252
    Thanks
    23
    Thanked 0 Times in 0 Posts
    The "Please choose..." is selected by default. I want the user to be forced to choose one of the four below it.

  • #4
    Regular Coder
    Join Date
    Jan 2003
    Posts
    867
    Thanks
    4
    Thanked 8 Times in 8 Posts
    Code:
    <html>
    <head>
    <script language="javascript">
    
    function validate(fieldindex){
      if (fieldindex==0){
        alert('Please select a product');
        return false;
      }
      return true;
    }
    
    </script>
    
    </head>
    
    <body>
    
    <form onsubmit="return validate(this.product.selectedIndex)">
    
    <select name="product">
    <option selected>Please choose...</option>
    <option>product 01</option>
    <option>product 02</option>
    <option>product 03</option>
    <option>product 04</option>
    </select>
    <input type="submit">
    </form>
    
    </body>
    
    </html>

  • #5
    Regular Coder
    Join Date
    Aug 2005
    Posts
    252
    Thanks
    23
    Thanked 0 Times in 0 Posts
    Works great although I failed to mention there are two other onsubmits and an onclick I'm using.

    onSubmit="return (Require(this,'Name') && submitonce(this))"

    onclick="return checkit()"

    Here is the js for the them:

    Code:
    // Check for a valid email address
    
    var testresults
    function checkemail(){
    var str=document.formCheck.Email.value
    var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i
    if (filter.test(str))
    testresults=true
    else{
    alert("Please input a valid email address.")
    testresults=false
    }
    return (testresults)
    }
    
    function checkit(){
    if (document.layers||document.getElementById||document.all)
    return checkemail()
    else
    return true
    }
    
    // Check for required fields
    
    function Require(obForm,szFields)
        {
          var fields = szFields.split(",")
          var szMissing= new Array();
          for (x=0;x<fields.length;x++) {
            if (obForm.elements[fields[x]].value.length==0) {
               szMissing[szMissing.length]=new String(fields[x]);
            }
          }
          if (szMissing.length) {
            alert("The"+((szMissing.length>1)?"s ":" ")+szMissing.join(",")+" field must be completed.");
            return false
          }
          return true;
        }
    
    // Check for multiple submissions
    
    function submitonce(theform){
    //if IE 4+ or NS 6+
    if (document.all||document.getElementById){
    //screen thru every element in the form, and hunt down "submit" and "reset"
    for (i=0;i<theform.length;i++){
    var tempobj=theform.elements[i]
    if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset")
    //disable em
    tempobj.disabled=true
    }
    }
    }
    Any way to incorporate it?
    Last edited by Errica; 09-08-2006 at 05:16 PM.

  • #6
    Regular Coder
    Join Date
    Aug 2005
    Posts
    252
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Fixed

    Adding this to the function "Require" worked:

    Code:
    function Require(obForm,szFields)
        {
          var fields = szFields.split(",")
          var szMissing= new Array();
          for (x=0;x<fields.length;x++) {
            if (obForm.elements[fields[x]].value.length==0) {
               szMissing[szMissing.length]=new String(fields[x]);
            }
          }
          if (szMissing.length) {
            alert("The"+((szMissing.length>1)?"s ":" ")+szMissing.join(",")+" field must be completed.");
            return false
          }
    	  if (!document.formCheck.product.selectedIndex) {
    		alert("Please choose a product.");
    		return false
    	}
          return true;
        }


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •