javascriptjqueryhtmlclient-side-data

How to save form input data to a XML file using Javascript?


I want to save these form inputs in a file (e.g XML) in order to be able to use it later in the form again:

<html>
    <body>
        <form action="demo_form.asp">
            First name: <input type="text" name="FirstName" value="Mickey"><br>
            Last name: <input type="text" name="LastName" value="Mouse"><br>
            <input type="submit" value="Submit">
        </form>

        <p>Click the "Submit" button and the form-data will be sent to a page on the server called "demo_form.asp".</p>

    </body>
</html>

What is the easiest way to achieve this? I can't use PHP or ASP.NET.


Solution

  • If you need to save the data to your server, then you will need server-side tools ASP.NET or PHP, as you say.

    However, you said you wanted to store the data in XML format so that you can use it later in the form. You can use the data later in the same page and put it into XML like this:

    interval=setInterval(function(){
        first=$('[name*="FirstName"]').val();
        last=$('[name*="LastName"]').val();
        output='<data><first>'+first+'</first><last>'+last+'</last></data>';
        $('#output').text(output);
    },200);
    

    http://jsfiddle.net/pA8nC/

    But I can't think of any reason why you would want to do that! You can use plain JavaScript or JQuery to access the values directly:

    JQuery:

    firstName=$('[name*="FirstName"]').val();
    lastName=$('[name*="LastName"]').val();
    

    JS:

    firstName=document.form.FirstName.value;
    lastName=document.form.LastName.value;