如何将json数据插入表中？答案

【问题标题】：How to insert json data in to table?如何将json数据插入表中？
【发布时间】：2015-02-12 11:14:53
【问题描述】：

我已经编写了 php 代码来生成 json 数据，现在我们必须将这个 json 数据显示到表格中。我的 php 代码能够生成数据但不能插入到表中，请帮助我。

我的php代码生成json数据booking.php

<?php
header('Access-Control-Allow-Origin: *');//Should work in Cross Domaim ajax Calling request
mysql_connect("localhost","root","2180");
mysql_select_db("service");

$query="Select * from customer where services='2'";
$result=mysql_query($query);

if ( $result === false ) {
  die("Can\'t do that: " . mysql_error());
}

$retVal = array();
//MYSQL_ASSOC remove key =field identifier
while( $row = mysql_fetch_array( $result, MYSQL_ASSOC ) ) {
  $retVal[] = $row;
}
echo json_encode( $retVal );

我的 javascript 将 json 数据打印到表中

<script>    
            function fetchData1(){              
                $(".data-contacts1-js tbody").empty();
                $.get("http://localhost/service/newJobs.php", function(data) {
                    $.each(data, function(i, contact) {
                        $(".data-contacts1-js").append(

                            "<td>" + contact.cust_name + "</td>" +
                            "<td>" + contact.cust_mobile + "</td>" +
                            "<td>" + contact.cust_email + "</td>" +
                            "<td>" + contact.cust_address + "</td>" +

                            );
                    });
                });
            }  

             $(document).ready(function(){
                  $(".data-contacts1-js tbody").empty();
                $('#fetchContacts1').click(function() {
                     fetchData1();
                });
            });

        </script>

上述php代码生成的JSON格式

[
    {
        "cId": "65",
        "address1": "PWD Road, B Narayanapura, Bengaluru, Karnataka, India",
        "address2": "JSS Layout, Mysore, Karnataka, India",
        "city": "Bangalore",
        "comments": "ds",
        "email": "you@gmail.com",
        "landMark": "PWD Road, B Narayanapura, Bengaluru, Karnataka, India",
        "scheduledDate": "13-Feb-2015",
        "scheduledTime": "10:30 AM",
        "services": "2",
        "userContactNumber": "1220000000",
        "userName": "Gajendra"
    }
]

表格的html代码

<div class="row-fluid">
                        <!-- block -->
                        <div class="block">
                            <div class="navbar navbar-inner block-header">
                                <div class="muted pull-left">Carpenter Services</div>
                            </div>
                            <div class="block-content collapse in">
                                <div class="span12">
                                     <table class="data-contacts1-js table table-striped" >
                                          <thead>
                                            <tr>
                                                  <th>ID</th>
                                                  <th>Customer Name</th>
                                                  <th>Customer Mobile</th>
                                                  <th>Customer Email</th>
                                                  <th>Address</th>
                                                  <th>Date</th>
                                                  <th>Time</th>
                                                  <th>Status</th>
                                            </tr>
                                          </thead>
                                      <tbody>

                                      </tbody>
                                    </table>                                    
                                </div>
                                <button id="fetchContacts1" class="btn btn-default" type="submit">Refresh</button>                          
                            </div>
                        </div>
                        <!-- /block -->
                    </div>

【问题讨论】：

您的问题是什么？您的代码是否有效，如果没有，什么无效？您是否在控制台中遇到错误？您需要提供更多信息。
你能给出当前的输出吗
在 .append() 中在表格单元格周围添加标签。此外，如果您的文档中有标签，请将它们添加到您的 .append() 选择器中（反之亦然）。
在这一行的末尾有一个额外的 + ："<td>" + contact.cust_address + "</td>" +
@Andy，很抱歉，请再次检查，如果可能，请不要关闭此问题。

【解决方案2】：

这是一种使用 JavaScript 的方法

     function fetchData1(){              
                    $(".data-contacts1-js tbody").empty();
                    $.get("http://localhost/service/newJobs.php", function(data) {
                    data=JSON.parse(data); //if the server returns text instead JSON object                       
                     for(var i in data){
                         var tr=$("<tr></tr>");
                         tr.append("<td>" + data[i].cust_name + "</td>" +
                                "<td>" + data[i].cust_mobile + "</td>" +
                                "<td>" + data[i].cust_email + "</td>" +
                                "<td>" + data[i].cust_address + "</td>");
                         $(".data-contacts1-js tbody").append(tr);
                       }
                    });
                }  

                 $(document).ready(function(){
                      $(".data-contacts1-js tbody").empty();
                    $('#fetchContacts1').click(function() {
                         fetchData1();
                    });
                });

在服务器脚本 (php) 上添加第一行

header('Content-type: application/json');

【讨论】：

我已经按照你的要求完成了，但在表格中它为每一列都给出了 undefined..
这是我对您的 JSON 数据的回应 - Gajendra 1220000000 you@gmail.com PWD Road, B Narayanapura, Bengaluru, Karnataka, India。没有未定义的:)
感谢我得到相同的数据格式，但无法打印到表格中，并且每列未定义请帮助我。
我添加了 data=JSON.parse(data) 试试这个