How to store temporary data at the client-side and then send it to the server

I need to store data temporarily at the client-side to allow users to add, edit or delete items without having to query the server for each of these actions; just when the user finishes adding items and clicks on the Add button, the list is sent to the server to be saved permanently.

This image describes what I want to achieve. I know I have to use arrays in JavaScript, but I don't know how to create one to store objects (in this case Detail which contains :id, price and description).

I hope you can help me out. Thanks in advance. PS: I'm using JSP and... sorry for my English

Answers


Sure, since it's a table it makes sense to have an array of objects. Note that an object is surrounded by curly braces and an array is surrounded by brackets:

var myArray = [];  // Initialize empty array
var myObject = {}; // Initialize empty object

This should accomplish what you need:

// Initialize variables
var newEntry, table = [];

// Create a new object
newEntry = {
  id: '',
  price: '',
  description: ''
};

// Add the object to the end of the array
table.push(newEntry);

Which is the same as this:

// Initialize array
var table = [];

// Create object and add the object to the end of the array
table.push({
  id: '22',
  price: '$222',
  description: 'Foo'
});

You can now access properties like this: table[0].id; // '22'

On modern browsers, if you want the data to persist across sessions (like cookies) you could use the sessionStorage or localStorage objects.

When you want to send the data to the server, you'll send a JSON version of the table across the wire:

var data = JSON.stringify(table);

Need Your Help

I cannot move files from one folder to another with shutil.move after several attempts

python python-2.7 close shutil del

There are many posts related with moving several files from one existing directory to another existing directory. Unfortunately, that has not worked for me yet, in Windows 8 and Python 2.7.

Rescuing a swallowed Exception in Java

java exception exception-handling

Some 3rd party library swallowed an Exception:

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.