...

View Full Version : AutoSave Jquery Plugins



romal4u
02-13-2012, 06:12 PM
autosave.js


(function( $ ) {

$.fn.autosave = function( par_options,fncall ) {

var def = {
url : '',
formid : '',
delay : ''
},options = $.extend(def,par_options);
var myDiv=$(this);

if(options.url!="")
{

if(options.delay!="")
{
var refreshId = setInterval(function(){

$.ajax({
url : options.url,
data : $("#"+options.formid).serialize(),
success : function(data){
myDiv.fadeIn(2000);
myDiv.html(data);
myDiv.fadeOut(2000);
if($.isFunction(fncall))
{
fncall.call();
}
},
error : function(jqXHR){
if(jqXHR)
{
myDiv.html("Param Mismatched");
}
}
});

},options.delay);
}
else
{
$.ajax({
url : options.url,
data : $("#"+options.formid).serialize(),
success : function(data){
myDiv.html(data);
if($.isFunction(fncall))
{
fncall.call();
}
},
error : function(jqXHR){
if(jqXHR)
myDiv.html("Param Mismatched");
}
});
}
}

};
})( jQuery );


demo file for auto save plugins.
here u can easily save ur form auto.for that u have to set url in which code for saving data and second parameter is formid and third parameter is delay.

U can also use thi function on click off button as like example.


<script src="jquery.js"></script>
<script src="autosave.js"></script>
<script>

$(document).ready(function(){
//$("#res").hide();
$("#res").autosave({
url : 'save.php',
formid : 'fr1',
delay : 10000
});
});

function clickme()
{
$("#res").show();
$("#res").autosave({
url : 'save.php',
formid : 'fr1'
});
}
</script>


<form name="fr1" id="fr1">
<table border=0 width="400px">
<tr>
<td colspan="2" align="center" height="30"><span id="res"></span>&nbsp;</td>
</tr>
<tr>
<td>Username : </td>
<td><input type="text" name="uname" value=""></td>
</tr>
<tr>
<td>Password : </td>
<td><input type="text" name="pass" value=""></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="button" name="subme" value="Save" onclick="javascript:clickme();"></td>
</tr>
</table>
</form>



Here, for saving data Save.php




if($_REQUEST["uname"]!="")
{
/*
code for save data...
*/
print_r($_REQUEST);
echo "Data Saving...";
}
else
{
echo "Enter Data...";
}

romal4u
02-18-2012, 03:06 PM
autosave.js



(function( $ ) {

$.fn.autosave = function( par_options,fncall ) {

var def = {
url : '',
formid : '',
delay : ''
},options = $.extend(def,par_options);
var myDiv=$(this);

if(options.url!="")
{
if(options.delay!="")
{
var refreshId = setInterval(function(){
$(":input").change(function(){
$(this).each( function() {
$.ajax({
url : options.url,
data : $("#"+options.formid).serialize(),
success : function(data){
myDiv.fadeIn(2000);
myDiv.html(data);
myDiv.fadeOut(4000);
if($.isFunction(fncall))
{
fncall.call();
}
},
error : function(jqXHR){
if(jqXHR)
{
myDiv.html("Param Mismatched");
}
}
});
});
});

},options.delay);
}
else
{
$(":input").keyup(function()
{
$(this).each( function() {
$.ajax({
url : options.url,
data : $("#"+options.formid).serialize(),
success : function(data){
myDiv.fadeIn(2000);
myDiv.html(data);
myDiv.fadeOut(4000);
if($.isFunction(fncall))
{
fncall.call();
}
},
error : function(jqXHR){
if(jqXHR)
{
myDiv.html("Param Mismatched");
}
}
});
});
});
}

}

};
})( jQuery );



demo file for auto save plugins when u change value of any input element data saved auto.
here u can easily save ur form auto.for that u have to set url in which code for saving data and second parameter is formid and third parameter is delay which is optional.

U can also use this function on click of button as like example.


<script src="jquery.js"></script>
<script src="autosave.js"></script>
<script>

$(document).ready(function(){
//$("#res").hide();

$("#res").autosave({
url : 'save.php',
formid : 'fr1'
});
});

</script>


<form name="fr1" id="fr1">
<table border=0 width="400px">
<tr>
<td colspan="2" align="center" height="30"><span id="res"></span>&nbsp;</td>
</tr>
<tr>
<td>Username : </td>
<td><input type="text" name="uname" value=""></td>
</tr>
<tr>
<td>Password : </td>
<td><input type="text" name="pass" value=""></td>
</tr>
<tr>
<td>Gender : </td>
<td>
<input type="radio" name="gender" value="male">Male
<input type="radio" name="gender" value="female">Female
</td>
</tr>
<tr>
<td colspan="2" align="center"><input type="button" name="subme" value="Save" onclick="javascript:clickme();"></td>
</tr>
</table>
</form>


Here, for saving data Save.php



<?php

if($_REQUEST["uname"]!="")
{
print_r($_REQUEST);
echo "Data Saving...";
}
else
{
echo "Enter Data...";
}

?>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum