Я пытаюсь вставить несколько чисел в массив, а затем хочу назначить массив скрытому вводу для публикации с формой.
При каждом щелчке я помещаю значение в массив, но массив, кажется, переинициализируется при каждом щелчке, поэтому он сохраняет только последнее переданное значение.
Полный сценарий:
- открыть модальное всплывающее окно содержит форму (форма загружается с помощью ajax).
- выберите категорию, тогда элементы категории также будут загружены ajax. (общий код ниже на этой странице).
- щелкните элемент, чтобы получить полную информацию об элементе с помощью ajax, загрузить их в div и отправить идентификатор элемента в массив.
- массив, в котором сохранены идентификаторы выбранных элементов, будет назначен скрытому элементу ввода.
Поэтому, если пользователь выберет другую категорию, страница элементов будет перезагружена, и это является причиной того, что массив каждый раз переинициализируется.
$(document).ready(function(){
var added_items = [];
$('.items-list .one-item').click(function(e){
e.preventDefault();
if(added_items.indexOf($(this).attr('href')) < 0){
ajaxLoad('<?=Yii::$app->urlManager->createUrl('bookings/item'); ?>', $('.added-items'), {item:$(this).attr('href')}, true);
added_items.push($(this).attr('href'));
$('#added-items-list').val(JSON.stringify(added_items));
}
else{
alert("item already exist");
}
});
});
Итак, как я могу сохранить идентификаторы предметов и разместить их в форме.
3 ответа
Что я сделал (протестировал и успешно работал):
Страница формы:
$(document).ready(function(){
localStorage.clear();
...
$('form').on('submit', function(){
$('#added-items-list').val(JSON.stringify(localStorage["added_items"]));
});
});
Страница товаров:
$(document).ready(function(){
var added_items = [];
if(localStorage.getItem("added_items")===null){
localStorage["added_items"] = JSON.stringify(added_items);
}
else {
// Parse the serialized data back into an array of objects
added_items = JSON.parse(localStorage.getItem('added_items'));
}
$('.items-list .one-item').click(function(e){
e.preventDefault();
if(added_items.indexOf($(this).attr('href')) < 0){
added_items.push($(this).attr('href'));
localStorage.setItem('added_items', JSON.stringify(added_items));
}
else{
alert("item already exist");
}
});
Три возможные причины
1.) form
перезагрузка страницы
2 ) . if(added_items.indexOf($(this).attr("href")) < 0)
возвращает false
3 ) . Один .one-item
элемент, имеющий $(this).attr("href")
, см. 2)
Использование localStorage
; примечание, не проверено
$(document).ready(function() {
var added_items = localStorage.getItem("items") || [] ;
$('.items-list .one-item').click(function(e) {
e.preventDefault();
if (typeof added_items === "string") {
added_items = JSON.parse(added_items);
}
if (added_items.indexOf($(this).attr('href')) < 0) {
added_items.push($(this).attr('href'));
localStorage.setItem("items", JSON.stringify(added_items));
// note, not certain if page reloads here ?
// should $('#added-items-list').val(localStorage.getItem("items"));
// be called before `ajaxLoad` ?
ajaxLoad('<?=Yii::$app->urlManager->createUrl('
bookings / item '); ?>', $('.added-items'), {
item: $(this).attr('href')
}, true);
$('#added-items-list').val(localStorage.getItem("items"));
} else {
alert("item already exist");
}
});
});
Ваш код:
$(document).ready(function(){
var added_items = [];
...
}
Кажется, находится внутри загруженного контента ajax, поэтому этот код запускает каждый вызов ajax. Вы должны переместиться как минимум var added_items = [];
за пределы загруженного ajax-контента.
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.