Question

my problem is that———i have many input controls on my form, in my asp.net multiuser web application, when user enter values in half of the controls and power is switched off,user looses all of entered data ,and he has to fill the form from begining .
so i want to store all user inputs in an xml file through javascript on lost focus of each control(every time regenerating the new file and deleting old file) and store that in a file on client side.i have tried it to store in cookie ,but the xml string size is more than cookie size limit.
also i want to store the xml file data to database at last from server side.

so is there any problem in my approach ? or any other way to solve my purpose ?
any suggesion will be appreciated .

thank you.

Answer 1

You can use this way as a base. This is using only js. Its better to save as json than xml on the clientside localstorage. No JQuery:

<form>
    <input id="txt1" onchange="saveDraft()" type="text" />
    <input id="txt2" onchange="saveDraft()" type="text" />
    <input id="txt3" onchange="saveDraft()" type="text" />
    <input id="btnSubmit" type="submit" value="submit" />
</form>

<script type="text/javascript">
var elements = ["txt1","txt2","txt3"];

function saveDraft(){
    var values= new Object;
    for(var i=0;i<elements.length;i++){
        values[elements[i]] = document.getElementById(elements[i]).value;
    }
    localStorage["draft"] = JSON.stringify(values);
}

window.onload = function (){
    restoreDraft();
}

function restoreDraft(){
    var values;
    if(localStorage["draft"] ){
        values = JSON.parse(localStorage["draft"]);
    }
    else
        return;
    if(confirm('Do you want to restore saved draft?')){
        for(var i=0;i<elements.length;i++){
            document.getElementById(elements[i]).value = values[elements[i]];
        }
        localStorage["draft"] ='';
    }           
}
</script>