Ajax调用json undefined对象:对象

时间:2016-02-16 02:00:45

标签: php jquery json ajax mysqli

json值保持返回未识别或者根本不显示

PHP代码

$index=0;

while($row = $result->fetch_array()){

    $index++;
    $data=array(

        array(

            $index=>$row['menuName']
        )

    );


  }

    echo json_encode($data);
}

JQUERY AJAX

<script>
         $(document).ready(function(){
              $.ajax({
                    type: 'GET',
                    data: {loadpage: 'table'},
                    dataType: 'json',
                    url: 'addtable.php',
                    success: function(data){        

                        $('.navbar ul').append('<li><a href="#" class="table">'+data[0]+'</a></li>');
                } 
                }); //ajax request
             });
    </script>

json很好,它以正确的格式显示。当我将我的jquery更改为data [0]时,它显示对象Object,如果我执行数据[1或更高],它会给我未定义。我不知道我做错了什么我甚至尝试过这样做:data [0] .1并且它什么也没显示。

任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:2)

首先要做的是修复响应请求的PHP脚本部分。

创建有效的JSON字符串响应。最简单的方法是首先创建一个容器(数组)。

然后第二个是不断推送那里的行。然后最后使用json_encode

在循环内部进行编码:

简单示例:

// initialize container
$data = array();

// the pushing of rows
while($row = $result->fetch_array()) {
    $data[] = $row; // push the whole row
}

// finally, echo it to into a JSON string
echo json_encode($data);
// don't put me inside the WHILE

PHP注意:如果这是mysqli,我建议改为使用 ->fetch_assoc() ,或者只是 ->fetch_array(MYSQLI_ASSOC)标志即可。

在您的AJAX脚本中,只需像往常一样处理响应:

<script>
 $(document).ready(function(){
      $.ajax({
        type: 'GET',
        data: {loadpage: 'table'},
        dataType: 'json',
        url: 'addtable.php',
        success: function(data){
            // every each row, create an LI element with an anchor
            $.each(data, function(index, element){
                $('.navbar ul').append('<li><a href="#" class="table">'+element.menuName+'</a></li>');
                // just use the column names as the properties in your data response that came from PHP
            });       


        } 
    }); 
});
</script>

如果这样运行,这应该会产生这样的标记:

<li>
    <a href="#" class="table">Table1</a>
</li>
<li>
    <a href="#" class="table">Table2</a>
</li>
<li>
    <a href="#" class="table">Table4</a>
</li>