SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Form validation with a forced submit

    I have a page that has a select list on it. In the tag of that select list I have the following:

    Code:
     
    <select multiple name='cardSelect' size='20' onChange='document.forms[0].submit();'>
    Now, in the form tag that this is associated with I have the following:

    Code:
     
    <form method='post' action='index.php?page=newDeck' enctype='multipart/form-data' onSubmit='return checkForm(this);'>
    I have included in the <HEAD> of the file a .js file with the checkForm function in. In the checkForm function all I have is this:
    Code:
     
    function checkForm(formobj)
    {
     alert("testing");
     return false;
    }
    This code is never getting run. When I click on a new item in the select window, the form submits and the page is reloaded. No alerts are given. Is this being bypassed with the forced form submission in the onChange tag of the <SELECT> tag? How can I fix this?

    Thanx for any help you can provide!

  2. #2
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As you can see from this page the submit() method doesn't invoke onsubmit. A workaround.
    Code:
    <html>
    <head>
    <title>TEST</title>
    <script type="text/javascript">
    function checkForm( f )
    {
    	alert( "testing" );
    	return false;
    }
    </script>
    <form name="myForm" onsubmit="return checkForm(this)">
    	<select onchange="this.form.Submit.click();">
    		<option>1</option>
    		<option>2</option>
    		<option>3</option>
    	</select>
    	<input type="submit" value="submit" name="Submit" />
    </form>
    </body>
    </html>
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  3. #3
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The problem with that code is that I don't have a submit button for the form, which is why I was forcing a submit using the 'document.forms[0].submit();' functionality. How do you do this without using a submit button?

  4. #4
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This?
    Code:
    <html>
    <head>
    <title>TEST</title>
    <script type="text/javascript">
    function checkForm( f )
    {
    	// code to validate
    	if ( validated )
    	 f.submit();
    }
    </script>
    <form name="myForm">
    	<select onchange="checkForm(this)">
    		<option>1</option>
    		<option>2</option>
    		<option>3</option>
    	</select>
    </form>
    </body>
    </html>
    Why can't you put in a submit button?
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev




  5. #5
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Client need mostly. They want to be able to just click on the select list and have the form submit itself. They don't want to also have to click the submit button everytime. So, in their minds, if they don't want to use it, they shouldn't see it on the page either. Using the submit button was my first attempt, until I got "notified" of their needs.

    Using the code/method above does exactly what I need. Thanx for all your help, beetle. It is greatly appreciated.

  6. #6
    orange pips! orange pips!
    Join Date
    Oct 2001
    Location
    Its all about location
    Posts
    652
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Actually, shoot, there is a slight modification that had to be made to the code, for anyone else who will need this in the future.

    Code:
    <html>
    <head>
    <title>TEST</title>
    <script type="text/javascript">
    function checkForm( f )
    {
    	// code to validate
    	if ( validated )
    	 f.form.submit();
    }
    </script>
    <form name="myForm">
    	<select onchange="checkForm(this)">
    		<option>1</option>
    		<option>2</option>
    		<option>3</option>
    	</select>
    </form>
    </body>
    </html>

  7. #7
    Web-coding NINJA! silver trophy beetle's Avatar
    Join Date
    Jul 2002
    Location
    Dallas, TX
    Posts
    2,900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oop, ya, missed that. Looks like you got it under control, though

    glad to help

    Nielsen would go ape over a method like this In case you don't know what I mean, relying on javascript to submit the form is a BIG usability no-no. Just make sure your client understands that.
    beetle a.k.a. Peter Bailey
    blogs: php | prophp | security | design | zen | software
    refs: dhtml | gecko | prototype | phpdocs | unicode | charsets
    tools: ide | ftp | regex | ffdev





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
  •