Auto remember form input content while typing using JQUERY


When clients inserting data into form, suddenly their connection lost or accidentally refreshed the web page. And guess what? they facing new empty form again and feel tired to inserting same data again. We can reduce this by using JQUERY cookies which can remember what clients type into form. So, when they refreshed pages even close and open it again, they have previous input data.

To do this, you must download Jquery & Jquery Cookies.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<script type="text/javascript">

    function remember( selector ){
        $(selector).each(
                function(){
                    //if this item has been cookied, restore it
                    var name = $(this).attr(‘name’);
                    if( $.cookie( name ) ){
                        $(this).val( $.cookie(name) );
                    }
                    //assign a change function to the item to cookie it
                    $(this).change(
                    function(){
                        $.cookie(name, $(this).val(), { path: ‘/’, expires: 1 });
                    }
                );
            }
        );
    }

    $(document).ready(function(){

       $(function() {
            remember(‘[name=website]’);
        })

        $(‘#region a’).click(function(){
            var newValue = $(‘#OodleSearch’).val() + ‘ ‘ +$(this).text();
            $(‘#OodleSearch’).attr(‘value’,newValue);
        })

    })
</script>

Now if you have input form with name attribute is “website” :

1
<input type="text" name="website" />

Then, now it’s auto remembering.

Kudos to : http://www.komodomedia.com/blog/2008/07/using-jquery-to-save-form-details/


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.