2015-09-03 11 views
6

Kiedy widzę w narzędziu programisty debugowania, zapytanie ajax odpowiedziało danymi, ale dane nie są renderowane w polu tekstowym. Dane zawierają pewne znaki specjalne, jak widać na zdjęciu.jQuery autouzupełnianie żądania ajax nie wyświetla zwracanych danych

Co jest dokładnie nie tak z funkcją odpowiedzi? Co (jak może kodować utf-8) powinienem dodać do wywołania ajax, aby wyświetlić znak specjalny?

enter image description here

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 
      }); 
     } 
    }); 

Kontroler:

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); 
      } 
     } 

    } 

Model:

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; 
} 
+0

Która biblioteka autouzupełnianie używasz? Czy deklarujesz, która własność zwróconych obiektów ma być używana jako etykieta? – Phillip

+0

to jquery ui autouzupełnianie. Jak widać w kodach jquery właśnie wyrenderowałem dane json (zawiera wartości i etykiety) –

+0

@PriskaAprilia: Co zawiera funkcję 'response' js? – Zl3n

Odpowiedz

2

Udało mi się rozwiązać ten problem, modyfikując kod wewnątrz zdarzenia success. Oto jak to zrobiłem.

zmiana

success: function(data) { 
       response(data); 
      } 

do

success: function(data) { 

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

} 
Powiązane problemy