我的应用程序出现问题,每当客户端输入案例时,我都会将数据存储在localStorage中。这是我的html使用模态。
<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   
<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(&#34; dataObjects&#34;)中堆叠许多数组,然后再将其发送到我的离线模式应用程序的服务器上,
(对不起我的英文)
答案 0 :(得分:1)
您需要从本地存储中获取旧数据,然后将新对象推送到旧数据。然后,您可以将其保存回本地存储。
var oldObject = localStorage.getItem('dataObject');
oldObject.push(dataObject);
localStorage.setItem('dataObject', JSON.stringify(dataObject));
答案 1 :(得分: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");
}
});