我已经构建了一个用数组中的数据填充字段的表单。
我有两个按钮,一个将'post‘与Ajax - Submit,另一个我试图跳到数组中的下一个对象- Skip。
我想不出怎样才能使跳过按钮工作。我有found代码,可以让你跳到下一个记录,当它只有一个记录显示,但我有许多记录,我添加到div的,所以需要一些其他的东西。
如何跳到数组中的下一个对象?
下面是我的代码的JSfiddle:http://jsfiddle.net/8vf4rs1w/
这里的代码是一个简化的代码.我有大约20个输入框,我也在添加数据。
<form>
<h1>Record: #<div id="record_id"></div></h1><h5>Date Added: <div id="date_added"></div></h5><br/>
<div class="form-group">
<label for="est_name">Name:</label>
<input type="text" class="form-control" id="est_name" placeholder="Est Name" disabled>
</div>
<div class="btn-group">
<button type="submit" class="btn btn-primary">Verify</button>
<button type="button" id="skip" class="btn btn-secondary">Skip</button>
</div>
</form>
获取Json
$(document).ready(function(){
$.getJSON('getJSON.php', { get_param: 'name' }, function (data) {
console.log(data)
var index = 0;
var record_id = data[index].id;
var est_name = data[index].name;
var date_added = data[0].reg_date;
$('#record_id').text(record_id);
$('#date_added').text(date_added);
$('#est_name').val($('#est_name').val() + est_name);
});
});
JSON
[ 0: {id: "1", name: "name1", locale: "locale1" }
1: {id: "2", name: "name2", locale: "locale2" }
2: {id: "3", name: "name3", locale: "locale3" } ]
发布于 2018-10-16 02:46:16
要滚动记录数组,您必须将数组和索引存储在更高的作用域中,并在单击跳过按钮时递增索引,如下所示:
$(document).ready(function(){
// The variables that need to be remembered throughout the app
var index = 0;
var records = [];
// Function to set form values
function displayRecord(){
var record = records[index];
$('#record_id').text(record.id);
$('#date_added').text(record.reg_date);
$('#est_name').val(record.name);
}
// Increment index when the skip button is clicked and display data
document.getElementById('skip').addEventListener('click', function(){
index++;
displayRecord();
});
$.getJSON(/**/
records = data;
displayRecord();
/**/);
});
https://stackoverflow.com/questions/52822464
复制相似问题