Ads

May 13, 2013

Submit multiple forms with jQuery and Ajax


Two weeks back I had posted "Facebook like multi Toggle Comment Box with jQuery and PHP" I received emails from my readers that asked to me how to submit multiple forms with jQuery and ajax. So in this tutorial I implemented. Download the script just you have to change the database details. Take a look live demo

Submit multiple forms with jQuery and  Ajax.

Download Script     Live Demo

Javascript Code

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" >
$(document).ready(function()
{
$(".comment_submit").click(function(){
var element = $(this);
var Id = element.attr("id");
var test = $("#textboxcontent"+Id).val();
var dataString = 'textcontent='+ test + '&com_msgid=' + Id;
if(test=='')
{
alert("Please Enter Some Text");
}
else
{
$("#flash"+Id).show();
$("#flash"+Id).fadeIn(400).html('<img src="ajax-loader.gif" align="absmiddle"> loading.....');
$.ajax({
type: "POST",
url: "insertajax.php",
data: dataString,
cache: false,
success: function(html){
$("#loadplace"+Id).append(html);
$("#flash"+Id).hide();
}
});
}return false;});});
</script>



PHP and HTML Code
Here $msg_id from the database more details take a look old post.
<div id="loadplace<?php echo $msg_id; ?>"></div>
<div id="flash<?php echo $msg_id; ?>"></div>
<div class='panel' id="slidepanel<?php echo $msg_id; ?>">
<form action="" method="post" name="<?php echo $msg_id; ?>">
<textarea id="textboxcontent<?php echo $msg_id; ?>" ></textarea><br />
<input type="submit" value=" Comment_Submit "
class="comment_submit" id="<?php echo $msg_id; ?>" />
</form>
</div>

insertajax.php

<?php
if(isSet($_POST['textcontent']))
{
$textcontent=$_POST['textcontent'];
// Some SQL data values insert into comments table
}
?>
<div class="load_comment">
<?php echo $textcontent; ?></div>

4 comments:

Anonymous said...

great dude :)

Anonymous said...

will it work?

Nishant Kondal said...

yes, it will
If you find any kind of problem then comment here again with your email ID

Nishant Kondal said...

thanks, and keep on visit

Most Popular Posts