76009

Incrementing key value to save data in localstorage

Question:

I need to increment key value when I'm saving data to localstorage because when I click button key is same for all records and record just update,doesn't creating new. I know I can do this with closures bit I'm fresh in JS and dont know how to do it correct.

(function() { window.onload = function() { document.getElementById('buttonCreate').onclick = function() { var topicValue = document.getElementById("create-topic").value; var statusValue = document.getElementById("create-status").value; var descriptionValue = document.getElementById("create-description").value; var key = 0; var storage = new Storage(); var ticket = { topic: topicValue, status: statusValue, description: descriptionValue }; storage.set(key, ticket); return (function() { key++; return key; }()); } } })(); function Storage() { this._ITEMS_DESCRIPTOR = 'items'; } Storage.prototype.get = function() { var fromStorage = localStorage.getItem(this._ITEMS_DESCRIPTOR); return fromStorage ? JSON.parse(fromStorage) : []; }; Storage.prototype.set = function(key, items) { localStorage.setItem(key, JSON.stringify(items)); };

Answer1:

You need declare the variable before the function, to save the value and add 1+.

(function() { window.onload = function() { var key = 0; //move var key to here document.getElementById('buttonCreate').onclick = function() { var topicValue = document.getElementById("create-topic").value; var statusValue = document.getElementById("create-status").value; var descriptionValue = document.getElementById("create-description").value; // var key = 0; remove these line var storage = new Storage(); var ticket = { topic: topicValue, status: statusValue, description: descriptionValue }; storage.set(key, ticket); return (function() { key++; return key; }()); } } })();

Recommend

  • How to insert variables to dat.Gui with an array?
  • Security risks from user-submitted HTML
  • Opening a Modal Window “using” PHP
  • JavaScript Interface to a Browser not working in 4.2.2
  • Deduce parent class of inherited method in C++
  • Hide HTML elements without javascript, only CSS
  • Web.config system.webserver errors
  • How do I get HTML corresponding to current DOM tree?
  • Transactional Create with Validation in ServiceStack Redis Client
  • JQuery Internet Explorer and ajaxstop
  • JSON response opens as a file, but I can't access it with JavaScript
  • Alert pop up with LWUIT
  • Disabling Alt-F4 on a Win Forms NotifyIcon
  • req.body is undefined - nodejs
  • Get object from AWS S3 as a stream
  • Java applet as stand-alone Windows application?
  • Modifying destination and filename of gulp-svg-sprite
  • MySQL WHERE-condition in procedure ignored
  • Change an a tag attribute in JavaScript based on screen width
  • Importing jscolor library in angular 2
  • Adding custom controls to a full screen movie
  • Function pointer “assignment from incompatible pointer type” only when using vararg ellipsis
  • 0x202A in filename: Why?
  • jqPlot EnhancedLegendRenderer plugin does not toggle series for Pie charts
  • VB.net deserialize, JSON Conversion from type 'Dictionary(Of String,Object)' to type '
  • Comma separated Values
  • How to delete a row from a dynamic generate table using jquery?
  • AngularJs get employee from factory
  • Error creating VM instance in Google Compute Engine
  • using HTMLImports.whenReady not working in chrome
  • Hits per day in Google Big Query
  • how does django model after text[] in postgresql [duplicate]
  • How to CLICK on IE download dialog box i.e.(Open, Save, Save As…)
  • File not found error Google Drive API
  • Authorize attributes not working in MVC 4
  • EntityFramework adding new object to nested object collection
  • Binding checkboxes to object values in AngularJs
  • Net Present Value in Excel for Grouped Recurring CF
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize
  • How to load view controller without button in storyboard?