MyChances.net

I’ve been updating the site to use Prototype.js, an Ajax framework. In the process, I was looking for some demo code. Scriptaculous, as they often do, came to the rescue. However, they have a bug on their page that deals with the Prototype Ajax.Updater. They say:

Alternative out-of-band form submit:

Instead of using the onSubmit property of the form itself, use a simple button’s onClick value, and have the form’s onSubmit return false. This will stop users from being able to hit return and submit the form, but if you are trying to combine effects or functions (like resetting the form after the Updater finishes, as in the example) this may provide a working solution. Combining certain functions inside the onSubmit seems to create a few problems.

<form id="myform" action="/action/here" method="post" onsubmit="return false;">

</form>


<p id="changeme">&nbsp;</p>

But the problem with the demo code is that the input-submit tag is not closed. If you run more than one of these tags on a page, you’ll get really bizarre errors. So to fix the problem, just close the tag:

<form id="myform" action="/action/here" method="post" onsubmit="return false;">

<input name="myinput" type="text" />

<input value="Submit!" onclick="$('changeme').innerHTML = 'Refreshing...'; new Ajax.Updater('changeme', 'processmyform.php', {asynchronous:true, parameters:Form.serialize('myform')});$('myform').reset();$('myinput').activate();return false;" type="button" />
</form>

<p id="changeme">&nbsp;</p>



								
Tags: ajax, coding, javascript, prototype, scriptaculous
				

					
						This entry was posted
												on Monday, March 17th, 2008 at 4:53 am						and is filed under MyChances.net.
						You can follow any responses to this entry through the RSS 2.0 feed.

													You can leave a response, or trackback from your own site.