Question

我希望能够从JQuery显示我的数据库查询结果。我提供了我的PHP脚本，当一个元素被删除时，使用Jquery从$ _POST传递了两个变量。

drop: function(event, ui){
    var name = ui.draggable.find("img").attr("id");
    var path = ui.draggable.find("img").attr("alt");
    $.post('wardrobe.php', { name: name, path: path}, function(data){
        //append here!! 
    });     

}

传回一个php数组（数据），其中包含一个键引用的六个元素，例如

$result['name'] = $name;

我可以用PHP显示这些元素，但我希望JQuery能够处理这个，我希望结果以模态显示。

我已尝试以下测试，但未显示任何内容。

$.post('Create_Item_Controller.php', { name: name, path: path}, function(data){
                         $.each(data, function (i, elem) {

                            $('#display-inner').html(elem);

                         });

我也尝试过：

$('#display-inner').html(elem).show();
$('#display-inner').html(elem.title).show();

如果我替换数组并且只是附加（数据）并从我的php脚本中回显一些字符串，则显示正确，

$('#display-inner').html(data); //displays the echo from php script correctly

那么如何列出数组并显示其键引用的数据内容？另外，我想在它自己的div中显示每个元素，并将div附加到＃display-inner，如我的代码所示？

我试过了：

    content = “<div id=”item”<p><label>Title: </label> elem.name</p></div> “;
$(content).appendTo(#display-inner);

现在按照建议添加了JSON编码，但仍然没有显示

        $.post('Create_Item_Controller.php', { name: name, path: path}, function(data){
                     $.each(data, function (i, elem) {
                     content = '<div id="item"<p><label>Title: </label> elem.name</p></div>';
                        $(content).appendTo('#display-inner');

                     });

            },'json');

我已经对JQuery和PHP脚本进行了更改，但仍然遇到了同样的问题

$.post('Create_Item_Controller.php', { name: name, path: path}, function(data){
                        console.log(data);
                        $('#display-inner').html(data.title);
                        $('#display-inner').html(data.name);
                        $('#display-inner').html(data.title);


            },"json");

PHP

if(isset($_POST['name'])){
$js = new Create_Item_Controller();
$data = $js->getElement();
echo json_encode($data);
}

我也试过

echo json_encode( array( 'data' => $data ) );

我现在尝试将代码更改为使用$ .jsonGet

            var name = ui.draggable.find("img").attr("id");
            var path = ui.draggable.find("img").attr("alt");
            var url = 'Create_Item_Controller.php';
            $.getJSON(url, { name: name, path: path }, function(data){
                console.log(data);

                $('#display-inner').html(data.name);
                $('#display-inner').html(data);         
            });

PHP

$js = new Create_Item_Controller();
$data = $js->getElement();
echo json_encode($data);

现在从控制台获取输出

Uncaught TypeError: Cannot read property 'name' of null
(anonymous function)drag-drop.js:21
f.Callbacks.njquery-1.7.1.js:2
f.Callbacks.o.fireWithjquery-1.7.1.js:2
wjquery-1.7.1.js:4
f.support.ajax.f.ajaxTransport.send.d

有谁能建议如何做到这一点？或者我错了！

由于

Answer 1

我认为您需要在dataType电话中设置$.post参数。据我记忆，默认值是 ~~text~~ （实际上，它是智能猜测），因此接收数据不会被解析为object，你不应该迭代它的元素/属性。

$.post('wardrobe.php', { name: name, path: path}, function(data){
    console.log(data);
}, 'json');

调试服务器端代码：

if(isset($_POST['name'])){
    $js = new Create_Item_Controller();
    $data = $js->getElement();

    die("DIE: " . print_r($data,1)); // see what is $data
    echo json_encode($data);

    // OR

    echo json_encode($data);
    die("JSON ERROR: " . json_last_error());
}

官方json-last-error文档。

无论哪种方式，您都可以得出结论哪部分代码会产生错误。遗憾的是，当数据包含json_encode个字符时，NULL会返回格式错误的字符串，或只是UTF-8。

Answer 2

您需要json_encode要发送回的数组，以便能够在客户端进行迭代。

所以这就是你在php脚本中要做的事情。

echo json_encode( array( 'result' => $result ) );

然后在客户端。

$.post('wardrobe.php', { name: name, path: path}, function(data){
       $.each( data.result, function( i, element ){ 
           console.log( element ); // you can see this in the console. 
           // your code here
       });  
}, 'json');

JQuery显示$ _POST循环结果并在屏幕上显示，不显示任何内容

2 个答案:

调试服务器端代码：