Skip to content

Instantly share code, notes, and snippets.

@jonatanrdsantos

jonatanrdsantos/prototypejs-submit-form-via-axaj.html

Created October 1, 2015 19:34
Show Gist options
  • Save jonatanrdsantos/a4b96060c5a06165e0ca to your computer and use it in GitHub Desktop.
Save jonatanrdsantos/a4b96060c5a06165e0ca to your computer and use it in GitHub Desktop.
Download ZIP
submit form via axaj prototype.js
Raw
prototypejs-submit-form-via-axaj.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Forms with Prototype</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="pragma" content="no-cache" />
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript">
// <![CDATA[
document.observe('dom:loaded', function() {
function sendForm(event){
// we stop the default submit behaviour
Event.stop(event);
var oOptions = {
method: "POST",
parameters: Form.serialize("contactForm"),
asynchronous: true,
onFailure: function (oXHR) {
$('feedback').update(oXHR.statusText);
},
onLoading: function (oXHR) {
$('feedback').update('Sending data ... <img src="images/loading_indicator.gif" title="Loading..." alt="Loading..." border="0" />');
},
onSuccess: function(oXHR) {
$('feedback').update(oXHR.responseText);
}
};
var oRequest = new Ajax.Updater({success: oOptions.onSuccess.bindAsEventListener(oOptions)}, "processForm.php", oOptions);
}
Event.observe('submitButton', 'click', sendForm, false);
});
// ]]>
</script>
</head>
<body>
<div id="feedback"> </div>
<div id="contact">
<form id="contactForm">
<input type="text" name="name" />
<textarea cols="10" rows="10" name="question"></textarea>
<select name="referer" id="category">
<option value="" dir="ltr">Choose a category</option>
<option value="Google">Google</option>
<option value="Friend">From a friend</option>
<option value="Other">Other source</option>
</select>
<input type="submit" id="submitButton" value="send contact form" />
</form>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment