2017-01-20 8 views
1

У меня проблема с моим приложением, где я буду хранить данные в локальном хранилище каждый раз, когда клиент вводит случай. вот мой html с использованием модального.Как я могу стек нескольких массивов в javascript localStorage?

  <div class="modal-body"> 
       <div class="form-group"> 
        <input class="form-control date-picker" placeholder="Month and Year" id="c_round" name="c_round"> 
       </div> 
       <div class="form-group"> 
        <select class="form-control" id="prov" name="prov"> 
         <option>Select Province</option> 
         <option value="01">Province1</option> 
         <option value="02">Province2</option> 
         <option value="03">Province3</option> 
        </select> 
       </div> 
       <div class="form-group"> 
        <select class="form-control" id="mun" name="mun"> 
         <option>Select Municipality</option> 
         <option value="01">Municipality1</option> 
         <option value="02">Municipality2</option> 
         <option value="03">Municipality3</option> 
        </select> 
       </div> 
       <div class="form-group"> 
        <select class="form-control" id="brgy" name="brgy"> 
         <option>Select Barangay</option> 
         <option value="001">Barangay1</option> 
         <option value=:002>Barangay2</option> 
         <option value="003">Barangay3</option> 
        </select> 
       </div> 
       <div class="form-group"> 
        <label for="commodity" class="control-label text-left">Household Classification</label> 
        <div class="form-horizontal"> 
         <input type="radio" name="h_classification" value="Farming"> Farming &emsp;&emsp; 
         <input type="radio" name="h_classification" value="Non-Farming"> Non-Farming 
        </div> 
       </div> 
      </div><!--End modal body--> 
      <div class="modal-footer"> 
       <button type="submit" id="create" class="btn btn-primary pull-right" data-dismiss="modal" >Create</button> 
      </div> 

Когда клиент нажимает кнопку «Создать», данные будут храниться в localStorage, вот мой jquery.

$(function() { 

var round = $("#c_round"); 
var prov = $("#prov"); 
var mun = $("#mun"); 
var brgy = $("#brgy"); 
var h_classification = $("[name='h_classification']"); 
var btn_create = $('#create'); 
var dataObject = []; 

btn_create.on('click', function(){ 
    if(typeof(Storage) !== "undefined"){ 
     dataObj = [{ 
      'user_id': user_id, 
      'prov' : prov.val(), 
      'mun' : mun.val(), 
      'brgy' : brgy.val(), 
      'r_code' : r_code, 
      'h_class': h_classification.val() 
     }]; 

     dataObject.push(dataObj); 

     localStorage.setItem('dataObject', JSON.stringify(dataObject)); 

     retrivedOjects = localStorage.getItem('dataObject'); 

     console.log('retrivedOjects: ', JSON.parse(retrivedOjects)); 
    }else { 
     alert("Error: Localstorage not supported"); 
    } 
}); 

}); 

Когда я обновить страницу старые данные по-прежнему существует, но когда я создаю новые данные старые данные заменяются новыми данными он не добавляет.

Я хочу, чтобы сложить множество массивов в LocalStorage («DataObjects») первый перед отправкой его на сервер для моего автономного режима приложения,

(простите за мой английский)

ответ

1

Набор dataObject к тому, что в настоящее время в LocalStorage до нажатия новые данные.

var dataObject = []; 
btn_create.on('click', function() { 
    if(typeof(Storage) !== "undefined") { 
     if (localStorage.getItem('dataObject') && localStorage.getItem('dataObject').length > 0) 
      dataObject = JSON.parse(localStorage.getItem('dataObject')); 
     dataObj = { 
      'user_id': user_id, 
      'prov' : prov.val(), 
      'mun' : mun.val(), 
      'brgy' : brgy.val(), 
      'r_code' : r_code, 
      'h_class': h_classification.val() 
     }; 
     dataObject.push(dataObj); 
     localStorage.setItem('dataObject', JSON.stringify(dataObject)); 

     retrivedOjects = localStorage.getItem('dataObject'); 

     console.log('retrivedOjects: ', JSON.parse(retrivedOjects)); 
    } else { 
     alert("Error: Localstorage not supported"); 
    } 
}); 
+0

Спасибо! @ Villa7_ – p3ac3

+0

Почему, когда dataObject пуст или localStorage пуст, он возвращает ошибку dataObject, null не может нажать – p3ac3

+0

О, я все равно понимаю, что он – p3ac3

1

вам необходимо старые данные из локального хранилища, а затем нажмите новый объект на старые данные. Затем вы можете сохранить его обратно в локальное хранилище.

var oldObject = localStorage.getItem('dataObject'); 
oldObject.push(dataObject); 
localStorage.setItem('dataObject', JSON.stringify(dataObject));