Как сохранить временные данные на стороне клиента, а затем отправить их на сервер

Мне нужно временно хранить данные на стороне клиента, чтобы пользователи могли добавлять, редактировать или удалять элементы без необходимости запрашивать сервер для каждого из этих действий; только когда пользователь заканчивает добавлять элементы и нажимает на добавить кнопка, список отправляется на сервер для постоянного сохранения.

этой изображения описывает, чего я хочу достичь. Я знаю, что должен использовать массивы в JavaScript, но я не знаю, как создать один для хранения объектов (в этом дело деталь который содержит: id, цену и описание).

надеюсь, вы сможете мне помочь. Спасибо заранее. PS: я использую JSP и... извините за мой английский

3 ответов


конечно, поскольку это таблица, имеет смысл иметь массив объектов. Обратите внимание, что объект окружен фигурными скобками, а массив - скобками:

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

это должно сделать то, что вам нужно:

// 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);

что то же самое, что и это:

// Initialize array
var table = [];

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

теперь вы можете получить доступ к таким свойствам: таблица[0].идентификатор; // '22'

в современных браузерах, если вы хотите, чтобы данные сохранялись в сеансах (например, cookies) , вы можете использовать объекты sessionStorage или localStorage.

когда вы хотите отправить данные на сервер, вы отправите JSON-версию таблицы по проводу:

var data = JSON.stringify(table);

вы можете создать массив ваших пользовательских объектов Detail довольно легко с помощью объектных литералов:

var details = [];
details.push({id:'abc1234', price:999.99, description:'Tesla Roadster'});
details.push({id:'xyz5678', price:129.99, description:'Land Rover'});

затем вы можете разместить свои данные на сервер, когда пользователь нажимает "добавить."


звучит как хорошая работа для JSON.