Souza
Souza

Reputation: 1143

Remember forms value in cookies to later finish

I have a form, and after the client fills out various forms i want it to be possible to navigate through the website, and return to the form and maintain them filled .

I thought about keeping cookies in the browser's client, other approaches that you might recommend?

About the code, here's the javascript part o thought of, i don't really know how to handle the server-side part, but i would like to use a class to define cookies. I'm new to this OOP thing, so if you can point me out on the right direction, i would appreciate

        fieldsToSave = ['nome','sobrenome','endereco','codigopostal','localidade','telemovel','email','codigopostal2','localidade2','endereco2','nif','entidade','codigopostal3','localidade3','endereco3','nserie','modelo'];      

        function ajaxrequest(){
            var params = [];
            for (var i=0; i < fieldsToSave.length; i++) {
                var ele = required[i];
                params[i] = ele + '=' + $('#' + ele).attr('value');
            }
            params = params.join('&');
            $(".agendarleft").html("LOADING");
            $.ajax({
            type: "GET",
            url: "ajaxload/como.php",
            data: params,
            success: function() {
            $(".agendarleft").html("SUCESS");
            }
            });
        }

Upvotes: 1

Views: 184

Answers (2)

Needhi Agrawal
Needhi Agrawal

Reputation: 1326

You can use cookies to store data at client-side as:
fieldsToSave = ['nome','sobrenome','endereco','codigopostal','localidade','telemovel','email','codigopostal2','localidade2','endereco2','nif','entidade','codigopostal3','localidade3','endereco3','nserie','modelo'];      

        function ajaxrequest(){
            var params = [];
            for (var i=0; i < fieldsToSave.length; i++) {
                var ele = required[i];
                params[i] = ele + '=' + $('#' + ele).attr('value');
            }
            document.cookie = "params="+params;
            $(".agendarleft").html("LOADING");
            $.ajax({
            type: "GET",
            url: "ajaxload/como.php",
            data: params,
            success: function() {
            $(".agendarleft").html("SUCESS");
            }
            });
        }

Upvotes: 1

Jeemusu
Jeemusu

Reputation: 10533

If you are simply doing it to save the client time re-filling in a form, then you may want to give the Sisyphus jQuery plugin a whirl:

To quote the plugins site:

Plugin developed to save html forms data to LocalStorage to restore them after browser crashes, tabs closings and other disasters.

http://simsalabim.github.com/sisyphus/

*although you should note, it requires a modern browser with HTML5 support.


Very straight forward to use. Include the plugin after your jQuery, and then you call it with the following (default options):

$('#form_id').sisyphus({
  customKeyPrefix: '',
  timeout: 0,
  autoRelease: true,
  name: null,
  onSave: function() {},
  onBeforeRestore: function() {},
  onRestore: function() {},
  onRelease: function() {},
  excludeFields: []
 });

Upvotes: 2

Related Questions