Get multiple values with local storage

Question

I'd like to retrieve the name and the date of created tasks. I managed to put the value taskMessage in local storage, but I don't know how to add taskName as well. This is the code I currently have :

$(document).ready(function () {

var i = 0;
for (i = 0; i < localStorage.length; i++) {
    var taskID = "task-" + i;

    $('.task-container').append("<li class='item-content' id='" + taskID + "'>" + localStorage.getItem(taskID) + "</li>");
}
$('.floating-button').on('click', function () {
    myApp.prompt('', 'Add Task', function (task) {
        if (task !== "") {
            myApp.prompt('', 'Choose time', function (time) {
                var d1 = new Date();
                d1.setHours(time, 0, 0, 0);
                var hour = d1.getHours();
                if (time > 0 && time < 25) {
                    var d2 = new Date();
                    var currenttime = d2.getHours();
                    if (time > currenttime) {
                        var taskID = "task-" + i;
                        var taskMessage = hour;
                        var taskName = task;
                        localStorage.setItem(taskID, taskMessage);
                        var newtask = '<li class="item-content ' + taskID + '"><div class="item-inner"><div class="item-title" >' + taskName + '</div><div class="item-after"> ' + taskMessage + ':00</div> </div></li>';
                        var taskitem = $('#' + taskID);
                        $('.task-container').append(newtask);
                    }
                    else {
                        myApp.addNotification({
                            message: 'Please choose a valide time period'
                        });
                    }
                }
                else {
                    myApp.addNotification({
                        message: 'Please choose a value between 1 and 24'
                    });
                }
            });
        }
        else {
            myApp.addNotification({
                message: 'Please enter a valid name'
            });
        }
    });
});
});

Answer 1

First you should get the data into a variable

var getData = 
{
   "firstData":"data1",
   "secondData":"data2",
   "thirdData": "data3"
}

Then you can set the above data's in localStorage...

localStorage.setItem('dataKey', JSON.stringify(getData ));

Then get....

var val = localStorage.getItem('dataKey');

Enjoy!!!

Answer 2

If you want to store two different values in localStorage then you can do somrthing like this :

• setItem in localStorage two times with different keys.

  localStorage.setItem("message", taskMessage);
  localStorage.setItem("name", taskName);
  

• Store both the values in an object.

  var obj = {
      "message": taskMessage,
      "name": taskName 
  }
  
  var val = localStorage.setItem("task", obj);
  

typeof val: string
Value of val: [object Object]
setItem method convert the input to a string before storing it.

Try this :

// Put the object into storage
localStorage.setItem('task', JSON.stringify(obj));

// Retrieve the object from storage
var val = localStorage.getItem('obj');

console.log('retrievedValue: ', JSON.parse(val));