通过具有相同名称的json ajax获取多个php数据

时间:2018-06-25 13:30:38

标签: php json ajax

我正在进行实时搜索,我需要使用json将php数据传输到ajax,但是问题是我无法传递包含2个或多个相同值的数组,这是php代码:

<?php
    class search{
        public function gettingvalues($search_value){
            require_once('db_conx.php');
            $dir = "http://localhost/usersimage/";
            $sql = "SELECT name,img,username FROM users WHERE username like '$search_value%' || name like '$search_value%'";
            $query = mysqli_query($conx,$sql);
            if ($query) {
                if (mysqli_num_rows($query) > 0) {
                    while ($row = mysqli_fetch_array($query)) {
                        $img = $row['img'];
                        $name = $row['name'];
                        $username = $row['username'];
                        $json = array('img' => $img, 'name' => $name, 'username' => $username);
                        echo json_encode($json);
                    }
                }
            }
        }
    }
?>

这是索引代码:

<?php

    if (isset($_POST['data'])) {
        require('search.php');
        $search = new search;
        $search->gettingvalues($_POST['data']);
        header('Content-Type: application/json; charset=utf-8');
        die();
    }
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $('input').keyup(function(){
            var value= $('input').val();
            $.ajax({
                type: "POST",
                url: "",
                data: {data: value},
                datatype: "json",
                success: function(json_data){
                    $('#feedback').html(json_data.name);
                }
            });
        });
    });
</script>
<input type="text" name="search" placeholder="looking for?">
<div id="feedback"></div>

因此,如果我的数组包含2个或更多相同的名称,ajax不会获取任何数据,我希望有人能给出答案。

2 个答案:

答案 0 :(得分:0)

更改此:

                while ($row = mysqli_fetch_array($query)) {
                    $img = $row['img'];
                    $name = $row['name'];
                    $username = $row['username'];
                    $json = array('img' => $img, 'name' => $name, 'username' => $username);
                    echo json_encode($json);
                }

收件人:

while ($row = mysqli_fetch_array($query)) {
    $img = $row['img'];
    $name = $row['name'];
    $username = $row['username'];
    $json[] = array('img' => $img, 'name' => $name, 'username' => $username);
}
echo json_encode($json);

在对jQuery的响应中,通过循环获取json数据。确保使用var obj = jQuery.parseJSON(json_data);循环之前

答案 1 :(得分:0)

您应该在搜索功能中创建包含所有结果的数组,然后在ajax响应循环结果中获取所有名称,并用逗号将其打印出来。

搜索功能

<?php
    class search{
        public function gettingvalues($search_value){
            require_once('db_conx.php');
            $dir = "http://localhost/usersimage/";
            $sql = "SELECT name,img,username FROM users WHERE username like '$search_value%' || name like '$search_value%'";
            $query = mysqli_query($conx,$sql);
            $results = []; //<!---
            if ($query) {
                if (mysqli_num_rows($query) > 0) {
                    while ($row = mysqli_fetch_array($query)) {
                        $img = $row['img'];
                        $name = $row['name'];
                        $username = $row['username'];
                        $json = array('img' => $img, 'name' => $name, 'username' => $username);
                        $results[] = $json;  //<!---
                    }
                }
            }
            echo json_encode($results); //<!---
        }
    }
?>

Ajax

<script type="text/javascript">
    $(document).ready(function(){
        $('input').keyup(function(){
            var value= $('input').val();
            $.ajax({
                type: "POST",
                url: "",
                data: {data: value},
                datatype: "json",
                success: function(json_data) {
                  var names = [];
                  $.each(json_data, function(index, element) {
                    names.push(element.name)
                  })
                  $('#feedback').html(names.join(','));
                }
            });
        });
    });
</script>
<input type="text" name="search" placeholder="looking for?">
<div id="feedback"></div>