dongwei1954
2016-06-07 08:21 浏览 64

jQuery PHP Mysql jSon显示循环数据

I have jQuery Ajax Autosuggest using jSon.

Now I have problem when showing the data. The data get from mysql data using PHP (looping data) but when get the result, it always show 1 row.

Here is my js code:

$.ajax(
{
    type: "GET",
    data: post_string,
    dataType: "json",
    cache: false,
    url: 'search.php',
    success: function(data)
    {
        full_name = data[0].full_name;
        username = data[0].username;

        $("#divResult").show();
        $(".display_box").html(username);
    }
});

and the search.php

$getSearchWord = mysqli_real_escape_string($con, $_GET['searchword']);
$json = array();

$searchQuery = mysqli_query($con, "SELECT * FROM tb_users WHERE username LIKE '%$getSearchWord%' OR full_name LIKE '%$getSearchWord%' LIMIT 5");
while($searchFetchData = mysqli_fetch_array($searchQuery))
        {
$json[] = array(   
            'username' => $searchFetchData['username'],
            'full_name' => $searchFetchData['full_name']
            );
}

echo json_encode($json);

and html div to display

<div id="divResult">
    <div class="display_box"></div>
</div>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

3条回答 默认 最新

  • 已采纳
    doufu1950 doufu1950 2016-06-07 08:32

    Json

    To clear out the field, call this before the Ajax request:

    $("#divResul").hide(200);
    $(".display_box").html('');
    

    You can try to run all returned array before putting it in your .display_box. Get the length of array returned from search.php then run it in a loop.

    success: function(data){
    
        $("#divResult").show(200);
    
        var n = data.length;
    
        for(var x = 0; x < n; x++){
    
            $(".display_box").append(data[x].full_name);
            $(".display_box").append(data[x].username);
    
        }
    
    }
    

    No Json

    OR without using json. From your search.php:

    $table = '<table>';
    
    $getSearchWord = mysqli_real_escape_string($con, $_GET['searchword']);
    $json = array();
    
    $searchQuery = mysqli_query($con, "SELECT * FROM tb_users WHERE username LIKE '%$getSearchWord%' OR full_name LIKE '%$getSearchWord%' LIMIT 5");
    while($searchFetchData = mysqli_fetch_array($searchQuery))
    
        $table .= '<tr>
                       <td>'.$searchFetchData['username'].'</td>
                       <td>'.$searchFetchData['full_name'].'</td>
                   </tr>';
    }
    
    $table .= '</table>';
    
    echo $table; /* RETURN THIS TO YOUR AJAX REQUEST */
    

    Then on your Ajax request:

    $.ajax(
    {
        type: "GET",
        data: post_string,
        url: 'search.php',
        success: function(data)
        {
            $("#divResult").show(200);
            $(".display_box").html(data);
        }
    });
    
    点赞 评论 复制链接分享
  • doubomudichen0832 doubomudichen0832 2016-06-07 08:41

    In ajax send data like this, it may work for you

    $.ajax(
    {
        type: "GET",
        data : { searchword: "keyword"},
        dataType: "json",
        cache: false,
        url: 'search.php',
        success: function(data)
        {
            full_name = data[0].full_name;
            username = data[0].username;
    
            $("#divResult").show();
            $(".display_box").html(username);
        }
    });
    
    点赞 评论 复制链接分享
  • dongre6073 dongre6073 2016-06-07 08:57

    Please try this in your success callback. All you need is to iterate with a $.each() and append to the div.

    success: function(data)
    {
        $.each(data,function(index,value) {
            full_name = value[0].full_name;
            username = value[0].username;
            $(".display_box").append(username . '<br/>');
        })
        $("#divResult").show();
    
    }
    
    点赞 评论 复制链接分享

相关推荐