jQuery自动填充选项没有显示出来

时间:2014-11-26 18:03:08

标签: php jquery json jquery-ui jquery-autocomplete

我在使用jQuery Autocomplete方面遇到了麻烦......我做的事情并不重要... 我使用json编码来填充de list,但即使JSON具有有效的格式,它也不会做任何事情。

这是我的代码:

search_pms_clients.php

<?php

require_once( 'core.php' );

header('Content-type: application/json; charset=utf-8');

class cliente_json {
   var $value;
   var $label;

   function __construct($label, $value, $nombre, $telefono, $zona){
      $this->label = $label;
      $this->value = $value;
    }
}
if (isset($_GET['term'])){

    $return_arr = array();  
    $client = trim(strip_tags($_GET['term']));
    $query = "SELECT tb1.nombre, tb1.id FROM (SELECT DISTINCT nombre, id FROM pms_clients UNION SELECT DISTINCT nombre, id FROM pms_clientsv) AS tb1 WHERE tb1.nombre LIKE '%" . $client . "%' ORDER BY tb1.nombre;";

    $result = db_query_bound( $query );

    // Retrieve and store in array the results of the query.
    while ( $row = db_fetch_array( $result )){

        array_push($return_arr, new cliente_json(utf8_encode(trim($row['id']) . ' - ' . trim($row['nombre'])), utf8_encode(trim($row['id'])) ));

    }
    print_r(json_encode($return_arr));
}
?>

打电话的php页面:

<script type="text/javascript">
$(function() {
            //autocomplete
            $(".client_select").autocomplete({
                //source: "search_agenda.php",
                source: "search_pms_clients.php",
                minLength: 3,
                select: function ( event, ui ) { // What happens when an autocomplete result is selected
                  console.log('HI');
                },
                change: function( event, ui ) {console.log('test');}
            });
        });
</script>

//more non-related code 

<input tabindex="5" type="text" name="custom_field_96" size="55" maxlength="255" class="custom_field_0 client_select" value="">

生成的json格式良好(在http://www.freeformatter.com/json-validator.html处检查):

例如调用search_pms_clients.php?term = alan%20b抛出这个json:

[{"value":"49006","label":"49006 - ALAN BAILEY","nombre":"ALAN BAILEY","telefono":"","zona":""},{"value":"59249","label":"59249 - ALAN BALDWIN","nombre":"ALAN BALDWIN","telefono":"","zona":""},{"value":"59164","label":"59164 - ALAN BALDWIN","nombre":"ALAN BALDWIN","telefono":"","zona":""},{"value":"26774","label":"26774 - ALAN BENTLEY","nombre":"ALAN BENTLEY","telefono":"02087485900","zona":""},{"value":"23989","label":"23989 - ALAN BENTLY","nombre":"ALAN BENTLY","telefono":"02087485900","zona":""},{"value":"6265","label":"6265 - ALAN BERRYMAN","nombre":"ALAN BERRYMAN","telefono":"","zona":""},{"value":"12726","label":"12726 - ALAN BICKLE","nombre":"ALAN BICKLE","telefono":"","zona":""},{"value":"1002","label":"1002 - ALAN BLAKENEY","nombre":"ALAN BLAKENEY","telefono":"01883 334577","zona":""},{"value":"79164","label":"79164 - ALAN BROOKS","nombre":"ALAN BROOKS","telefono":"","zona":""},{"value":"5734","label":"5734 - MR ALAN BURNS","nombre":"MR ALAN BURNS","telefono":"","zona":""},{"value":"88494","label":"88494 - MR. ALAN BARNETT","nombre":"MR. ALAN BARNETT","telefono":"","zona":""},{"value":"49771","label":"49771 - MR. ALAN BENTLEY","nombre":"MR. ALAN BENTLEY","telefono":"0208 748 5900","zona":""},{"value":"55117","label":"55117 - MR. ALAN BOWIE","nombre":"MR. ALAN BOWIE","telefono":"","zona":""}]

如果我使用一个简单的数组而不是我的json它运行良好(或多或少与此处相同:http://jqueryui.com/autocomplete/#default

如果我用这个替换源代码行:

source: function( request, response ) {
        $.ajax({
          url: "http://gd.geobytes.com/AutoCompleteCity",
          dataType: "jsonp",
          data: {
            q: request.term
          },
          success: function( data ) {
            response( data );
          }
        });
      },

它也可以完美地运作......

我做错了什么?如果有人能帮助我,我会非常感激。

我正在使用jQuery 1.10.2和jQuery UI 1.11.1

0 个答案:

没有答案