Monday, October 7, 2013

Sending Form Data to Next Page using JQUERY

Hiiii, sometimes we need to submit a form on our website and also wants that page does not gets refresh on form submit (which is a popular trend nowadays). But this no refreshing thing can only be possible by Javascript.
So, in this post I'll be teaching you how to submit a form using jQquery and send the data of form to a next page using ajax in a very simple manner.
You can also add validation within this code before form gets submit and is the form is filled correct then call the form's submit function.

Sending Form Data to Next Page using JQUERY

Here's the code :

<html>
<head>
<script type="text/javascript">
$(document).ready(function(){
$('#saveattribute').click(function(){

//you custom code but here I am sending values to next page
jQuery.ajax({
type: "POST",
url: "abcd.php",
data: $('#attribute_save').serialize()
}).done(function( msg ) {
//alert(msg);
//your code on success
});
})
})
</script>
</head>
<body>
<form id="attribute_save">
<table>
<tr>
<td>Select Style:
<select name="style_att" id="Attr">
<option value="">Select..</option>
<option value="23">men</option>
<option value="53">ringer-t</option>
<option value="52">t-shirt</option>
</select>
</td>
<td><input type="button" id="saveattribute"  value="Save"/></td>
</tr>
</table>
</form>
</body>
</html>

Hope you like this post……..Please Comment…………!!!!!!!!!


Tags: ,

1 Responses to “Sending Form Data to Next Page using JQUERY”

Unknown said...
October 10, 2013 at 6:40 PM

cool~i just setup a ajax powered page in 2minute. thank you for great snippet!


Post a Comment

© 2013 MyCodeStock. All rights reserved.
Designed by SpicyTricks