通过javascript将用户选择的页面控件值写入xml文件并存储在客户端计算机中

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.

我的问题是---------我的窗体上有很多输入控件,在我的asp.net多用户Web应用程序中,当用户输入一半控件中的值并关闭电源时,用户将失去所有输入控件输入数据,他必须从开头填写表格。所以我想通过javascript将所有用户输入存储在xml文件中,每次控件丢失焦点(每次重新生成新文件并删除旧文件)并将其存储在客户端的文件中。我已经尝试将其存储在cookie中,但xml字符串大小超过cookie大小限制。我也希望最后从服务器端将xml文件数据存储到数据库。

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

所以我的方法有什么问题吗?或任何其他方式来解决我的目的?任何建议将不胜感激。

thank you.

1 个解决方案

#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:

您可以使用这种方式作为基础。这只使用js。最好在客户端本地存储上保存为json而不是xml。没有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>