Go Back   CodingForums.com > :: Client side development > JavaScript programming > JavaScript frameworks

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 05-07-2008, 08:16 AM   PM User | #1
o0O0o.o0O0o
Senior Coder

 
o0O0o.o0O0o's Avatar
 
Join Date: Jan 2008
Location: C:\Windows\System32
Posts: 1,018
Thanks: 19
Thanked 9 Times in 9 Posts
o0O0o.o0O0o is infamous around these parts
jquery form submit response text

i am using jquery form plugin to submit form , the code is below

Quote:
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>

<script>

// prepare the form when the DOM is ready
$(document).ready(function() {
var options = {
target: '#output', // target element(s) to be updated with server response
beforeSubmit: showRequest, // pre-submit callback
success: showResponse // post-submit callback

// other available options:
url: 'test.php' // override for form's 'action' attribute //type: type // 'get' or 'post', override for form's 'method' attribute
//dataType: null // 'xml', 'script', or 'json' (expected server response type)
//clearForm: true // clear all form fields after successful submit
//resetForm: true // reset the form after successful submit

// $.ajax options can be used here too, for example:
//timeout: 3000
};

// bind to the form's submit event
$('#test1').submit(function() {
// inside event callbacks 'this' is the DOM element so we first
// wrap it in a jQuery object and then invoke ajaxSubmit
$(this).ajaxSubmit(options);

// !!! Important !!!
// always return false to prevent standard browser submit and page navigation
return false;
});

});

// pre-submit callback
function showRequest(formData, jqForm, options) {
// formData is an array; here we use $.param to convert it to a string to display it
// but the form plugin does this for you automatically when it submits the data
var queryString = $.param(formData);

// jqForm is a jQuery object encapsulating the form element. To access the
// DOM element for the form do this:
// var formElement = jqForm[0];

alert('About to submit: \n\n' + queryString);

// here we could return false to prevent the form from being submitted;
// returning anything other than false will allow the form submit to continue
return true;
}

// post-submit callback
function showResponse(responseText, statusText) {
// for normal html responses, the first argument to the success callback
// is the XMLHttpRequest object's responseText property

// if the ajaxForm method was passed an Options Object with the dataType
// property set to 'xml' then the first argument to the success callback
// is the XMLHttpRequest object's responseXML property

// if the ajaxForm method was passed an Options Object with the dataType
// property set to 'json' then the first argument to the success callback
// is the json data object returned by the server

alert('status: ' + statusText + '\n\nresponseText: \n' + responseText +
'\n\nThe output div should have already been updated with the responseText.');
}





</script>

</head>







<form id = "test1" name = "test2" method="post">

<input type = "text" name = "name" />
<input type = "text" name = "name2" />
<input type = "text" name = "name3" />
<input type = "text" name = "name4" />
<input type = "text" name = "name5" />
<input type = "text" name = "name6" />
<input type = "text" name = "name7" />


<input type = "submit" value = "click" />
</form>

<div id = "output">

here
</div>


</body>
</html>

I am getting error on the colore line
__________________
Please de-reputate me
© 0o0o0o0

Its better to rule in Hell then to serve in Heaven

Last edited by o0O0o.o0O0o; 05-07-2008 at 08:21 AM..
o0O0o.o0O0o is offline   Reply With Quote
Old 05-07-2008, 05:57 PM   PM User | #2
shyam
Senior Coder

 
shyam's Avatar
 
Join Date: Jul 2005
Posts: 1,563
Thanks: 2
Thanked 163 Times in 160 Posts
shyam will become famous soon enough
Quote:
Originally Posted by o0O0o.o0O0o View Post
Code:
// prepare the form when the DOM is ready
$(document).ready(function() {
var options = {
target: '#output', // target element(s) to be updated with server response
beforeSubmit: showRequest, // pre-submit callback
success: showResponse, //<-- post-submit callback

// other available options:
url: 'test.php' // override for form's 'action' attribute //type: type // 'get' or 'post', override for form's 'method' attribute
//dataType: null // 'xml', 'script', or 'json' (expected server response type)
//clearForm: true // clear all form fields after successful submit
//resetForm: true // reset the form after successful submit

// $.ajax options can be used here too, for example:
//timeout: 3000
};
...
well, you've found the solution yourself too...you are missing a comma for the previous element
__________________
You never have to change anything you got up in the middle of the night to write. -- Saul Bellow
shyam is offline   Reply With Quote
Old 05-08-2008, 01:26 AM   PM User | #3
o0O0o.o0O0o
Senior Coder

 
o0O0o.o0O0o's Avatar
 
Join Date: Jan 2008
Location: C:\Windows\System32
Posts: 1,018
Thanks: 19
Thanked 9 Times in 9 Posts
o0O0o.o0O0o is infamous around these parts
thanks shyam ,
you r best in JS
__________________
Please de-reputate me
© 0o0o0o0

Its better to rule in Hell then to serve in Heaven
o0O0o.o0O0o is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 09:38 PM.


Advertisement
Log in to turn off these ads.