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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jan 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Form.elements validation problem

    Hi,
    Having a problem getting a simple JavaScript function to work. Trying to do a simple form validation using onSubmit within the <form> tag, but I am writing out the form elements using PHP, and some of them are repeated 3 times, with the form names set to:

    <input type="text" name="edu[]" size="24" />

    it is for an online resume builder, and I need to give people the option of entering up to three entries for their education. When the form is submitted, the form elements that have the same name must include the "[]" in the name field so that the PHP code knows to expect an array of data.

    I need to validate that one field, to ensure applicants have entered at least one entry for their education, and I am not sure how to do it. This is the function I have now:

    function check(){
    if (document.form1.edu[].value==""){
    alert("Please enter at least one entry for your education ");
    return false;
    }
    }

    Of course this results in an error when the form is submitted...as the syntax is not correct. Can anyone help me with this? Just don't know how to get Javascript to deal with the textbox name "edu[]"

    I have tried this:
    function check(){
    if (document.form1.elements['edu[]'].value==""){
    alert("Please enter at least one entry for your education ");
    return false;
    }
    }
    but it didn't work...

    Many thanks,
    Paul

  • #2
    Regular Coder
    Join Date
    Jan 2003
    Posts
    867
    Thanks
    4
    Thanked 8 Times in 8 Posts
    Just to clarify, do you have three text boxes named edu[]?

    Like this?

    <form>
    <input type="text" name="edu[]" size="24" />
    <input type="text" name="edu[]" size="24" />
    <input type="text" name="edu[]" size="24" />
    </form>

  • #3
    New to the CF scene
    Join Date
    Jan 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    yes...

    three text boxes are written out dynamically via PHP, and everything works great on the server side, with the PHP parsing the array and extracting the values. I am just stuck on how to perform the client-side validation to ensure the user fills in at least one of the textboxes.

    Thanks,
    Paul

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,043
    Thanks
    0
    Thanked 251 Times in 247 Posts
    Quote Originally Posted by ptaylor
    I have tried this:
    function check(){
    if (document.form1.elements['edu[]'].value==""){
    alert("Please enter at least one entry for your education ");
    return false;
    }
    }
    but it didn't work...

    Many thanks,
    Paul
    That is almost correct. But you have multiple elements with that same name, so you must access them the way you do in array.
    Code:
    if (document.form1.elements['edu[]'][0].value==""){ //first field
    Here's the code:
    Code:
    function check(f){
      var educs = f.elements['edu[]'];
      if (educs.length){ //multiple fields
        for (var i=0; i<educs.length; i++){
           if (educs[i].value==""){
             alert("Please enter at least one entry for your education ");
             return false;
           }
        }
      }
      else{ //only 1 field
         if (educs.value==""){
           alert("Please enter your education ");
           return false;
         }
      }
      return true;
    }
    ...
    <form onsubmit="return check(this)">
    ...
    <input type="submit" value="Submit" />
    </form>
    I added a check if the fields are multiple or not to accommodate if only 1 field is dynamically generated.


  •  

    Posting Permissions

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