jQuery - 需要访问成功的ajax POST操作后收到的PHP数组值

时间:2010-01-09 13:49:52

标签: arrays jquery

平台:

jQuery,PHP,mySQL

我有什么:

我正在使用jQuery处理表单中的信息,并将所有POST数据发送到执行多个操作的php文件,并返回数据数组以及其他必要数据。其中一个数组是一个数组的数组。我需要访问这个数组值数组,以便我可以将每个嵌套数组值附加到表中。

我需要什么:

我一直在与jquery代码争斗,以使其工作很长一段时间,但它不起作用。所以,如果任何人可以帮助我解决 jquery代码,我真的很感激。提前谢谢。

表格结构

fname   lname    city
Ed        Al      SA
Bob       B       MN
Chris     V       KJ

PHP代码

//Content of my PHP file that return json encoded data
$success = 1;

$new_rows_data['fname'] = array();
$new_rows_data['lname'] = array();
$new_rows_data['city'] = array();

$result = mysql_query("SELECT fname, lname, city FROM table LIMIT 3");
while( $row = mysql_fetch_array($result) ) 
{
    $new_rows_data['fname'][] = $row['fname'];
    $new_rows_data['lname'][] = $row['lname'];
    $new_rows_data['city'][]  = $row['city']
}

print json_encode(array('success' => $success, 'new_rows_data' => $new_rows_data)); 

jQuery代码:

$('#button_delete').click(function() {  

  $.ajax({
   type: 'POST',  
   cache: false,
   url: 'test.php',
   data: $('#form1').serialize(), 
   dataType: 'json',
   success: function(data) {            

      if(data.success == '1')
      {
             jQuery.each(data.new_rows_data, function(i, val) 
            {
                 $('#table').append('<tr>'+

                          '<td>'+val.fname+'</td>'+           
                          '<td>'+val.lname+'</td>'+           
                          '<td>'+val.city+'</td>'+           

                  '</tr>');   

            });
      }//END if
     }       
   }) //END ajax

  return false;
});

我正在尝试将这些新数据附加到id为#table的现有表中,以便我看起来像以下所需的输出

First Name   Last Name  City
  Orko           C      OI    ---> (Existing row of data)
  Gordon        Flash   KS    ---> (Existing row of data)
  Ed             Al      SA    ---> New row of data that just got appended
  Bob            B       MN    ---> New row of data that just got appended
 Chris           V       KJ    ---> New row of data that just got appended 

3 个答案:

答案 0 :(得分:1)

当我开始在其中组合文本和对象时,Append对我来说从未如此友好。试试这个:

$.each(data.new_rows_data, function(i, val) {
   var tr = $('<tr></tr>');

   $.each(val, function(i, newVal){
      var td = $('<td></td>').text(newVal);
      tr.append(td);
   });

   $('#table').append(tr);
});

应该完成工作。

要更改为包含3列的多行:

最好将PHP阵列构建改为:

$result = mysql_query("SELECT fname, lname, city FROM table LIMIT 3");
$i = 0;
while( $row = mysql_fetch_array($result) ) 
{
    $new_rows_data[$i]['fname'] = $row['fname'];
    $new_rows_data[$i]['lname'] = $row['lname'];
    $new_rows_data[$i]['city']  = $row['city'];
    $i++;
}

答案 1 :(得分:1)

我刚刚从搜索中发现了这一点,并想指出代码所在的位置:

$new_rows_data['fname'][] = $row['fname'];
$new_rows_data['lname'][] = $row['lname'];
$new_rows_data['city'][]  = $row['city'];

这里发生的是你正在构建几个并行数组。在javascript中,单个值将是可见的,例如data.new_rows_data.fname[0]表示第一行的fname。当你对此进行$.each(...)时,你的函数应该看到i ==“fname”和val的参数等于一个3元素的名字数组。

munch的答案通过显式索引完成同样的事情,但对于您的具体情况,我会像这样编码:

$new_rows_data[] = $row;

或者对于值的计算不那么简单的情况:

$new_rows_data[] = array(
    'foo' => get_foo($row),
    'bar' => $row['bar']
);

在任何一种情况下,new_rows_data都会变成一个对象数组,其属性与您的PHP数组键相匹配,可以在javascript中以data.new_rows_data[1].fname访问。您的$.each(...)循环现在将i视为整数,并将val视为具有您期望的属性的对象。

答案 2 :(得分:0)

我看到的第一个问题是宽松的打字:

if(data.success === 1)

应该是

if(data.success == '1')

因为就javascript而言,所有从AJAX返回的数据都是一个字符串。我刚刚从@Jammus注意到你的PHP代码也应该将你的$success变量切换为值01