如何将 json 文件中的选定数据行绑定到输入字段（文本）？答案

【问题标题】：How can I bind a selected data row from a json file to an input field(text)?如何将 json 文件中的选定数据行绑定到输入字段（文本）？
【发布时间】：2018-06-10 04:59:34
【问题描述】：

我需要将单个 data(json) 行绑定到输入字段 onclick 事件。

<script>
                              var Jsonstr = <?php echo $resObjstr; ?>;
                              for (var key in Jsonstr) {
                                  if (Jsonstr.hasOwnProperty(key)) {
                                    //console.log(Jsonstr[key]["tile_name"] + ", " + Jsonstr[key]["id"]);
                                    $('.rowP1').append("<tr><td>"+Jsonstr[key]['id']+"</td><td><a href='#' title='"+Jsonstr[key]['tile_name']+"' id='"+Jsonstr[key]['id']+"' onClick='getDetails("+Jsonstr[key]['id']+",modifytile)'>"+Jsonstr[key]['tile_name']+"</a></td><td>"+Jsonstr[key]['detail']+"</td><td><img src='wp-content/themes/orchid-new/assets/img/"+Jsonstr[key]['image']+"' width='138' height='79' style='border:1px solid #999999;'/></td><td class='showprov' data-prov=''>"+Jsonstr[key]['providers']+"</td><td>"+Jsonstr[key]['states']+"</td><td>"+Jsonstr[key]['occurring']+"</td><td><button type='button' class='delTile' onclick='DelTiles("+Jsonstr[key]['id']+");'><i class='material-icons'>delete_forever</i></button></td></tr>");
                                  }
                              }
                          </script>
<a href="#"onclick='getDetails(tileid);'>Link</a>
function getDetails(tileid){
    console.log(tileid);
    if (tileid != null || tileid !=''){
        $('.nav-tabs a[href="#modifytile"]').tab('show');

        var jsondata = <?php echo $resObjstr; ?>;
        for (key in jsondata) {
            if (jsondata.hasOwnProperty(key)) {
                    $.each(jsondata[key], function (index, val) {
                        var txt = $('#tile_name').eq(index).val(val);
                        $('#tile_name').eq(index).val(val);
                        console.log(txt);
                    });
            }
        }
    }
}

相反，它显示 json 字符串的最后一行。从示例图像中可以看出，json 数据渲染得很好。 sample image

【问题讨论】：

标签： javascript jquery json data-binding binding

【解决方案1】：

在声明变量后使用console.log(jsondata) 来查看如何获取变量$resObjstr 并了解如何解析json 以供javascript 访问

【讨论】：

我已经知道jsondata字符串是什么了。它来自 wordpress 表。 PHP 代码全局 $wpdb; $results = $wpdb->get_results('SELECT * FROM wp_tiles', OBJECT); $resObj = json_encode($results); $resObjstr = (string)$resObj;
可以把生成的json放上去吗？
当您遍历 json 时，您必须将实际行与您需要的 id 进行比较，以便此时选择适当的行
哦，该文件有很多信息，但它与 Json 文件无关，因为我目前正在使用 json 数据填充表。查看更新的代码和图片。
嗯...应该有什么帮助？我可以毫无问题地显示记录。问题是单击一行的链接并让它填充表单以修改所选记录。

【解决方案2】：

所以，break 然后循环；

for (key in jsondata) {
    if (jsondata.hasOwnProperty(key)) {
            $.each(jsondata[key], function (index, val) {
                var txt = $('#tile_name').eq(index).val(val);
                $('#tile_name').eq(index).val(val);
                console.log(txt);
                return false;
            });
            break;
    }
}

【讨论】：

打破循环并不意味着我会得到正确的选择记录，这是我的问题。我希望能够单击循环的 json 字符串的链接并填充表单字段以通过 ajax 将记录修改到数据库。
"tileid" 哪里来的？