jQuery自动完成ajax请求不显示返回的数据

Posted 2023-02-24

【中文标题】jQuery自动完成ajax请求不显示返回的数据

【英文标题】：jQuery autocomplete ajax request not displaying returned data

【发布时间】：2015-11-29 08:45:10

【问题描述】：

当我在调试开发人员工具上看到 ajax 请求以数据响应但数据未呈现在文本框中时。如图所示，数据包含一些特殊字符。

响应函数到底出了什么问题？我应该在 ajax 调用中添加什么（可能像 utf-8 编码）来显示特殊字符？

html:

<select name="selCat">
    <option>....</option>
</select>

<input class="col-3" type="text" id="txtPOI" name="txtPOI" />

jquery:

$("#txtPOI").autocomplete(
        source: function(request, response) 
            $.ajax(
                url: '<?php echo site_url("crowd/get_POIs") ?>',
                data: cat: selectedCode, q: request.term,
                dataType: "json",
                type: "post",
                success: function(data) 
                    response(data);
                ,
                fail : function ( jqXHR, textStatus, errorThrown ) 
                    console.log(jqXHR);
                    console.log(textStatus);
                    console.log(errorThrown);
                ,minLength: 3
            );
        
    );

控制器：

function get_POIs()
        $cat = $this->input->post('cat');
        $q = $this->input->post('q');
        //echo $cat;

        if (isset($cat) && isset($q))
            $cat = strtolower($cat);
            $q = strtolower($q);
            $data=$this->crowd->get_POIs($cat,$q);
            //echo "aa";
            $a_json = array();
            if(count($data) > 0)
                foreach ($data as $row)
                      $a_json_row["title"] = $row->title;
                      $a_json_row["contentid"] = $row->contentid;
                      $a_json_row["latitude"] = $row->latitude;
                      $a_json_row["longitude"] = $row->longitude;
                      array_push($a_json, $a_json_row);

                
                echo json_encode($a_json);
               
        

    

型号：

function get_POIs($cat, $q)

    $this->db->DISTINCT();
    $this->db->select('title, a.contentid, latitude, longitude, address');
    $this->db->from('attraction a');
    $this->db->join('geographicdata g', 'a.contentid = g.contentid', 'left');
    $this->db->where('cat3 = "'.$cat.'"');
    $this->db->where('title like "%'.$q.'%"');
    $this->db->order_by('title','ASC');
    $query = $this->db->get()->result();
    //die(var_dump($query));
    //echo $this->db->get_compiled_select();
    return $query;

【问题讨论】：

您使用的是哪个自动完成库？您是否声明了返回对象上的哪个属性用作标签？

这是 jquery ui 自动完成。正如您在 jquery 代码中看到的，我刚刚渲染了 json 数据（包含值和标签）

@PriskaAprilia : js response 函数包含什么？

不是ajax响应吗？

试死(var_dump($query));在 $query = $this->db->get()->result() 之后；查看是否返回任何结果，以及在控制器中并发布结果以检查

【参考方案1】：

我设法通过修改success 事件中的代码解决了这个问题。这是我的做法。

改变

success: function(data) 
                response(data);
            

到

success: function(data) 

            response( $.map( data, function( item )
            
                return
                        label: item.title,
                        value: item.title,
                        contentid: item.contentid,
                        latitude: item.latitude,
                        longitude: item.longitude
                    
            ));