SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast casa's Avatar
    Join Date
    Oct 2002
    Location
    Alabama
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    field validation help

    I have 2 forms. In the first, the user enters the number of students requesting to take a class (1-50). It call the next form which has boxes for each students first and last name and then a bunch of info about the class. The html is built on the fly with PHP. The form would look something like this:
    Code:
    <form action="addclass.php" method="POST" name="input" id="input">
    <input type="hidden" name="numStudents" value="3">
    <p align="center">Add New Class Request</p>
    <div class="center">
    <table border="0" cellpadding="2" cellspacing="2">
    <tr>
    <th>1. First </th>
    <td><input id="fnm1" type="text" name="first1" value="" /></td>
    <th> Last: </th>
    <td><input id="lnm1" type="text" name="last1" value="" /></td>
    </tr>
    <tr>
    <th>2. First: </th>
    <td><input id="fnm2" type="text" name="first2" value="" /></td>
    <th> Last: </th>
    <td><input id="lnm2" type="text" name="last2" value="" /></td>
    </tr>
    <tr>
    <th>3. First: </th>
    <td><input id="fnm3" type="text" name="first3" value="" /></td>
    <th> Last: </th>
    <td><input id="lnm3" type="text" name="last3" value="" /></td>
    </tr>
    </table>
    </div>
    <div class="center">
    <table border="0" cellpadding="2" cellspacing="2">
    <tr>
    <th>Class Name: </th>
    <td><input id="classnm" type="text" name="classnm" value="" /></td>
    </tr>
    <tr>
    <th>Class Date: </th>
    <td><INPUT TYPE="text" id="classdt" NAME="date1x" value="" /></td>
    </tr>
    </table>
    </div>
    <div align="center">
    <input type="submit" name="submit" value="Submit" onClick="return ValAdd()" />
    <input type="Reset" title="Reset" />
    </div>
    </form>
    On the onClick="return ValAdd()" I need to validate whether the user entered all names (3 in this example). I'm trying to figure out how to loop through this. I will know in the javascript how many first/last combos I have because document.input.numStudent.value will equal 3 in this case. How do I loop through these three combos to make sure none is null?

    Thanks...
    Last edited by casa; Jan 6, 2004 at 11:21.

  2. #2
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Took a few liberties with your form...
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    <head>
    <title>untitled</title>
    <script type="text/javascript">
    
    function ValAdd(oForm)
    {
    	var first, last, i = 1, focus_me = null, msg = '';
    	while (first = oForm.elements['first' + i]) //check for 'first[n]' field
    	{
    		last = oForm.elements['last' + i];  //it exists, so get 'last[n]' field
    		if (/^\s*$/.test(first.value) || /^\s*$/.test(last.value)) //whitespace test
    		{
    			msg += '\nStudent #' + i;
    			if (focus_me == null)
    				focus_me = (/^\s*$/.test(first.value)) ? first : last; //save first empty field
    		}
    		++i;
    	}
    	if (msg != '')
    	{
    		msg = 'Please complete the following entries:\n' + msg + '\n\nThank you.';
    		alert(msg);
    		if (focus_me)
    			focus_me.focus();
    		return false;
    	}
    	return true;
    }
    
    
    </script>
    </head>
    <body>
    <form action="addclass.php" method="POST" name="addclass" id="addclass" onsubmit="return ValAdd(this)">
    <input type="hidden" name="numStudents" value="3">
    <h3>Add New Class Request</h3>
    <table cellpadding="5" cellspacing="0" border="0">
    <tr>
    <th>Student #</th><th>Last Name</th><th>First Name</th>
    </tr><tr>
    <td align="right"><strong>1</strong></td>
    <td><input id="fnm1" type="text" name="first1" value="" /></td>
    <td><input id="lnm1" type="text" name="last1" value="" /></td>
    </tr><tr>
    <td align="right"><strong>2</strong></td>
    <td><input id="fnm2" type="text" name="first2" value="" /></td>
    <td><input id="lnm2" type="text" name="last2" value="" /></td>
    </tr><tr>
    <td align="right"><strong>3</strong></td>
    <td><input id="fnm3" type="text" name="first3" value="" /></td>
    <td><input id="lnm3" type="text" name="last3" value="" /></td>
    </tr><tr>
    <td height="20" colspan="3"></td>
    </tr><tr>
    <td colspan="3" align="right"><strong>Class Name:</strong>
    <input id="classnm" type="text" name="classnm" value="" size="32" /></td>
    </tr><tr>
    <td colspan="3" align="right"><strong>Class Date:</strong>
    <input type="text" id="classdt" name="date1x" value="" size="32" /></td>
    </tr><tr>
    <td height="20" colspan="3"></td>
    </tr><tr>
    <td colspan="3" align="right">
    <input type="submit" name="Submit" value="submit" />
    <input type="reset" value="clear" onclick="return confirm('Clear all entries?')" />
    </td>
    </tr>
    </table>
    </form>
    </body>
    </html>
    Shouldn't use DOM objects like 'input' as names...they're not specifically reserved, but collisions are always possible. And don't name a submit button 'submit' (Form.submit already in the house ).
    ::: certified wild guess :::

  3. #3
    SitePoint Enthusiast casa's Avatar
    Join Date
    Oct 2002
    Location
    Alabama
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You are great! That solved my problem. I've got to study this more so I can figure out what you did. Thank you so very much.


Bookmarks

Posting Permissions

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