Do sessionStorage of Ajax Json feed

Question

I am trying to achieve a very simple procedure but cannot finish because of my skills and knowledge. What I have got => I retrieve the json feed from the server and it works fine.

What do I need => as soon the json feed retrieved add it to sessionStorage so when I will comeback to this page again (within the same session) data should be pulled from sessionStorage and not from the server via Ajax. Hope it does make sense.

the code is:

$(document).ready(function () {

if (window.sessionStorage.getItem("weather") === null) {

    $.ajax({
        url: 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20weather.forecast%20where%20woeid%3D24553463%20and%20u%20%3D%20"c"&format=json&diagnostics=true',
        async: false,
        callback: 'callback',
        crossDomain: true,
        contentType: 'application/json; charset=utf-8',
        type: 'POST',
        dataType: 'jsonp',
        timeout: 5000,
        success: function (data, status) {
            if (data !== undefined && data.query.results.channel !== undefined) {
                $('#weather').append('<div class="wcode">' + data.query.results.channel.item.condition.code + '</div><div class="temperature">' + data.query.results.channel.item.condition.temp + '°C</div><div class="details">' + data.query.results.channel.wind.speed + '/с<br/>' + data.query.results.channel.atmosphere.pressure + '<br/>' + data.query.results.channel.atmosphere.humidity + '% humid.</div>');
            }
            var output = $('#weather');
            window.sessionStorage.setItem("weather", JSON.stringify(output));
        }
    });

} else {
    var jsData = window.sessionStorage.getItem("weather", JSON.stringify(output));
}
});

the fiddle is here: http://jsfiddle.net/j8QGv/

Please do amendments with fiddle so other users can use the code as example.

Really appreciate your help...

Answer 1

Heres how you can use session storage

if (window.sessionStorage.getItem("weather") === null) {

    $.ajax({
        url: 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20weather.forecast%20where%20woeid%3D24553463%20and%20u%20%3D%20"c"&format=json&diagnostics=true',
        async: false,
        callback: 'callback',
        crossDomain: true,
        contentType: 'application/json; charset=utf-8',
        type: 'POST',
        dataType: 'jsonp',
        timeout: 5000,
        success: function (data, status) {
            if (data !== undefined && data.query.results.channel !== undefined) {
                $('#weather').append('<div class="wcode">' + data.query.results.channel.item.condition.code + '</div><div class="temperature">' + data.query.results.channel.item.condition.temp + '°C</div><div class="details">' + data.query.results.channel.wind.speed + ' м/с<br/>' + data.query.results.channel.atmosphere.pressure + ' мм рт. ст.<br/>' + data.query.results.channel.atmosphere.humidity + '% влаж.</div>');
            }
            var output = $('#weather').html(); // get the HTML
            window.sessionStorage.setItem("weather", output); // store it in session
        }
    });

} else {
    // this isn't how you use the getter method
    //var jsData = window.sessionStorage.getItem("weather", JSON.stringify(output));
    var jsData = window.sessionStorage.getItem("weather");
    $('#weather').html(jsData);
}

FIDDLE