jquery/Ajax php - loading image once file submit<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".save").live("click", function () {
$("#loading").fadeIn('slow');
var edit = $(".edit").val();
var id = $("#idrec").val();
var data = '?id=' + id + '&text=' + edit;
$.post("update.php", data, function (response) {
$("#loading").fadeOut('slow');
$("#status").html(data);
});
});
});
</script>
<style>
form {
width: 100%;
}
.save{
margin:0px 0px 0 5px;
}
#loading {
display:none;
}
</style>
<h2>jquery/Ajax php - loading image once file submit = <img id="loading" src="images/loading.gif"/></h2>
Click the text below to edit it. <span id="status"></span>
<form ><input type="hidden" id="idrec" value="2"/></span><textarea class="edit">jquery/Ajax php - loading image once file submit</textarea> </form>
<a href="#" class="save"><img src="images/save.png" border="0" width="48" height="15"/></a>
update.php
<?php
$text = $_POST['text'];
$id = mysql_escape_string($_POST['id']);
echo stripslashes($text);
?>
