将来自jQueryajax的json数据作为新行插入到表中


Inserting json data from jQuery ajax in to table as new row

我一直在尝试从ajax查询中添加数据,该查询返回以以下模式创建的json数据:$lastedited=$_GET['astload'];

$count = 1;
$JsonArray = Array();

while ($count <= 4) {  // luupataan x määrä ellei vastauksia tule.
$result = mysql_query("SELECT     RFQs.DateAdded as DateAdded,
                              Customers.Name as customer,
                              RFQs.ID as RFQID,
                              Suppliers.Name as supplier,
                              Ships.Name as ship,
                              RFQs.CustomerRef as CustomerRef,
                              Contacts.FirstName as contactF,
                              Contacts.LastName as contactL,
                              Contacts.Email as contactE,
                              Users.tunnus as handler,
                              RFQStatus.Name as status,
                              RFQs.Description
                   FROM       RFQs
                   LEFT JOIN  Ships ON RFQs.ShipID=Ships.ID
                   LEFT JOIN  Contacts ON RFQs.ContactID=Contacts.ID
                   LEFT JOIN  Customers ON RFQs.CustomerID=Customers.idCustomers
                   LEFT JOIN  Users ON RFQs.PriJobHandler=Users.id
                   LEFT JOIN  Suppliers ON RFQs.SupplierID=Suppliers.ID
                   LEFT JOIN  RFQStatus ON RFQs.StatusID=RFQStatus.ID
                   WHERE      RFQs.LastEdited > '$lastedited'
                  ") or die(mysql_error());
if (mysql_num_rows($result) == 0) {
  $count++;
  sleep(5);  // ei uusia rivejä, nukutaan 5 sekuntia ja yritetään uudelleen.
}else {
// käy rivit läpi ja pistää arrayyn  
  for ($x = 0, $numrows = mysql_num_rows($result); $x < $numrows; $x++) {  
    $row = mysql_fetch_assoc($result);  
    array_push($JsonArray, array("rivi" => array("ID" => $row["RFQID"],
                                        "DateAdded" => $row["DateAdded"], 
                                        "Supplier" => $row["supplier"], 
                                        "Customer" => $row["customer"], 
                                        "Ship" => $row["ship"],
                                        "CustomerRef" => $row["CustomerRef"],
                                        "Contact" => $row["contactF"]." ".$row["ContactL"],
                                        "Description" => $row["Description"],
                                        "PIC" => $row["handler"],
                                        "Status" => $row["status"])));  
}
$count = 6;
}
}
if ($count == 5) {
  echo "NO RESULTS!!";
}
else if ($count == 6) {
  //echo JSON to page  
  echo json_encode($JsonArray); 
}

我的jQuery是这样的:

<script type="text/javascript" charset="utf-8">
function waitForMsg(lastload){
    if (lastload==null){
      lastload = { "lastload": "<?php echo $lastload; ?>" };
    } 
    $.ajax({
        type: "GET",
        url: "GetUpdates.php",
        datatype: "json",
        data: lastload,
        async: true, /* If set to non-async, browser shows page as "Loading.."*/
        cache: false,
        timeout:50000, /* Timeout in ms */
        success: function(data){ /* kun tulokset saadaan niin suoritetaan.. */
            if (data=="NO RESULTS!!") {
            setTimeout(
                'waitForMsg()',
                1000
            );
            } else {
              displayrow(data.rivi);
            }
        },
        error: function(XMLHttpRequest, textStatus, errorThrown){
            addmsg("error", textStatus + " (" + errorThrown + ")");
            setTimeout(
                'waitForMsg()', /* Try again after.. */
                "15000"); /* milliseconds (15seconds) */
        },
    });
};
$(document).ready(function(){
    waitForMsg(); /* Start the inital request */
});
function displayrow(item)
{
  var tblRow =
            '<td id="showbutton-'+item.ID+'"><a href="#" onclick="hideShow(rowID'+item.ID+'">+</a></td>'
   +'<td id="DateAdded-'+item.ID+'">'+item.DateAdded+'</td>'
   +'<td id="Supplier-'+item.ID+'">'+item.Supplier+'</td>'
   +'<td id="Customer-'+item.ID+'">'+item.Customer+'</td>'
   +'<td id="Ship-'+item.ID+'">'+item.Ship+'</td>'
   +'<td id="CustomerRef-'+item.ID+'">'+item.CustomerRef+'</td>'
   +'<td id="Contact-'+item.ID+'">'+item.Contact+'</td>'
   +'<td id="Description-'+item.ID+'">'+item.Description+'</td>'
   +'<td id="PIC-'+item.ID+'">'+item.PIC+'</td>'
   +'<td id="Status-'+item.ID+'">'+item.Status+'</td>'
   +'<td id="Actions-'+item.ID+'">Hit F5 for actions</td>';
   $('#newRFQrowInput').before(tblRow);
}
</script>

问题是我不确定应该如何处理从ajax查询返回的数据。目前我所得到的一切都是不确定的。

有人能帮忙吗?

谢谢!

在php文件中进行更改,以发送回信息

$JsonArray = array("ID" => $row["RFQID"],
                    "DateAdded" => $row["DateAdded"], 
                    "Supplier" => $row["supplier"], 
                    "Customer" => $row["customer"], 
                    "Ship" => $row["ship"],
                    "CustomerRef" => $row["CustomerRef"],
                    "Contact" => $row["contactF"]." ".$row["ContactL"],
                    "Description" => $row["Description"],
                    "PIC" => $row["handler"],
                    "Status" => $row["status"]
            );
echo json_encode(array('rivi'=>$JsonArray));

更新:

在"For loop"中进行更改

$JsonArray = array();
for ($x = 0, $numrows = mysql_num_rows($result); $x < $numrows; $x++) {  
    while($row = mysql_fetch_assoc($result)){
        array_push($JsonArray,array("ID" => $row["RFQID"],
                                    "DateAdded" => $row["DateAdded"], 
                                    "Supplier" => $row["supplier"], 
                                    "Customer" => $row["customer"], 
                                    "Ship" => $row["ship"],
                                    "CustomerRef" => $row["CustomerRef"],
                                    "Contact" => $row["contactF"]." ".$row["ContactL"],
                                    "Description" => $row["Description"],
                                    "PIC" => $row["handler"],
                                    "Status" => $row["status"]
                                    )
                ); 
    }
}

将其替换为您的

else if ($count == 6) {
  //echo JSON to page  
  echo json_encode(array("rivi" =>$JsonArray)); 
}

以及在ajax中的成功功能。

success:function(data){
    if(data.rivi.length){
        //alert(data.rivi.length);
        displayrow(data.rivi);
    }               
}

然后最后在你的显示行功能

function displayrow($item){
    var tblRow = '<table>';
    $.each($item,function(index,value){
        tblRow +='<tr><td id="showbutton-'+value.ID+'"><a href="#" onclick="hideShow(rowID'+value.ID+'">+</a></td>'
               +'<td id="DateAdded-'+value.ID+'">'+value.DateAdded+'</td>'
               +'<td id="Supplier-'+value.ID+'">'+value.Supplier+'</td>'
               +'<td id="Customer-'+value.ID+'">'+value.Customer+'</td>'
               +'<td id="Ship-'+value.ID+'">'+value.Ship+'</td>'
               +'<td id="CustomerRef-'+value.ID+'">'+value.CustomerRef+'</td>'
               +'<td id="Contact-'+value.ID+'">'+value.Contact+'</td>'
               +'<td id="Description-'+value.ID+'">'+value.Description+'</td>'
               +'<td id="PIC-'+value.ID+'">'+value.PIC+'</td>'
               +'<td id="Status-'+value.ID+'">'+value.Status+'</td>'
               +'<td id="Actions-'+value.ID+'">Hit F5 for actions</td></tr>';
    }   
   tblRow = '</table>';
   $('#newRFQrowInput').before(tblRow);
}

在页面末尾写入echo json_encode($JsonArray);GetUpdates.php

如果您使用GET方法,那么我建议使用$.getJSON

你的数据从这边来

〔{rivi:{ID:23,添加日期:2012-02-10,…}〕

所以我给你举了一个例子,剩下的只是逻辑

var jsonData = [{rivi:{ID:'23', DateAdded:'2012-02-10'}}];
alert(jsonData[0].rivi.ID); // will return 23

你完成了吗

 json_encode( $JsonArray );

在归还之前?

echo $JsonArray