"If at first you don't succeed; call it version 1.0" :-Unknown

Pages

Tuesday, January 28, 2014

Restore data after browser crash

Restore data after browser crash

Its a client requirement and we implemented by using html 5 localstorage feature. Here i'm providing a sample of that.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Local storage</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
</head>
<body>
    <div>
        <div>
            <div>
                <label>Name:</label>
            </div>
            <div>
                <input type="text" id="name" />
            </div>
            <div>
                <input type="button" id="btnSave" value="Save" />
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(document).ready(function () {
            function init() {
                if (localStorage["name"]) {
                    $("#name").val(localStorage["name"]);
                }
            }
            init();
        });
        $('input').change(function () {
            localStorage[$(this).attr("id")] = $(this).val();
        });
        $("#btnSave").click(function() {
            localStorage.clear();
        });
    </script>
</body>
</html>

DEMO




If u had any trouble just ask, Happy to help u :)
Stay Tune...
Have a nice day... 'N happy Coding :)

No comments: