首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >跳到JSON数组中的下一个对象并填充输入框

跳到JSON数组中的下一个对象并填充输入框
EN

Stack Overflow用户
提问于 2018-10-16 02:08:11
回答 1查看 62关注 0票数 1

我已经构建了一个用数组中的数据填充字段的表单。

我有两个按钮,一个将'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" } ]
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 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();   
    /**/);   
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/52822464

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档