2

我正在为我的网站使用 PHP、jQuery、AJAX、JSON 等。我是 AJAX、JSON 和类似事物的新手。我正在一个文本框上实现自动完成功能。我已经为它编写了所有代码,我正在根据来自 PHP 文件的用户输入获得所需的 json 响应值,但我无法将此响应显示为建议。只有加载器图像不断旋转和旋转。同时,如果我查看“Firebug 控制台的响应”,我可以看到从 PHP 文件收到的正确响应。供您参考,我将我的代码中的必要代码片段放在下面。谁能指导我将这些收到的 json 响应值显示为启用自动完成的文本框下方的建议?为了更好地理解我的问题,我在 jQuery 代码中添加了一条评论,告诉我我的实际问题。

HTML 和 jQuery 代码如下:

<div class="form-element ui-widget">
  <input type="text" class="" name="user_name" id="user_name" value="{$user_name}"/>
</div>
$(function() {
  $( "#user_name" ).autocomplete({
  source: function( request, response ) {
    var class_id   = $('#class_id').val();
    var section_id = $('#section_id').val();
    $.ajax({
      url: "report_student_result.php?op=get_student_names&class_id="+class_id+"&section_id="+section_id,
      dataType: "jsonp",
      data: {
        featureClass: "P",
        style: "full",
        maxRows: 12,
        name_startsWith: request.term
      },
      success: function( data ) { 


    /*Actually here I'm having a problem in displaying the json values properly
          Can you guide me in writing the json valus properly
          Forgive me if I've written something wrong below as I'm a newbie in json*/
        /*response( data, function(item) {
          return {
            label: item.full_name,
            value: item.full_name
          }
        });*/
          var autoCompleteDataSource = $.map(data, function( item ) {
          return {
            label: item.full_name,
            value: item.user_id
          }
        });
        $("#user_name").autoComplete({source: autoCompleteDataSource});
      }
    });
  },
  minLength: 2,
  select: function( event, ui ) {if(ui.item) { alert(event);
                 $(event.target).val(ui.item.value);
             }
             return false;
  },
  open: function() {
  $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
  },
  close: function() {
  $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
  }
  });
});

现在PHP代码如下:

<?php
  require_once("../../includes/application-header.php");
  prepare_request();
  $request     = empty( $_GET ) ? $_POST : $_GET ;
  global $gDb;
  $op = $request['op'];
  switch($op) {
    case'get_student_names':
      $param = $_GET["name_startsWith"];
      $group_id = $request['class_id'];

      if($request['section_id'] !='all')
        $group_id = $request['section_id'];

      if ($group_id != '') {
     $sql  =" SELECT u.user_id, CONCAT(u.user_first_name, ' ', u.user_last_name) as full_name ";
     $sql .=" FROM ".TBL_USERS." as u JOIN ".TBL_USERS_GROUPS_SUBSCRIBE." as ugs ON u.user_id = ";
     $sql .=" ugs.subscribe_user_id WHERE ugs.subscribe_group_id = ".$group_id." AND (u.user_first_name ";
     $sql .=" REGEXP '^$param' OR  u.user_last_name REGEXP '^$param')";
       } else {
     $sql  =" SELECT user_id, CONCAT(user_first_name, ' ', user_last_name) as full_name ";
     $sql .=" FROM ".TBL_USERS." WHERE user_first_name REGEXP '^$param' OR user_last_name ";
      $sql .=" REGEXP '^$param'";    
    }

    $gDb->Query( $sql );
    $data = $gDb->FetchArray(); 

    $response = json_encode($data);
    echo $response;

    die;        
  }
?>

现在,当我输入单词“ash”时,firebug 控制台的响应菜单中显示的 json 响应值:

[{"user_id":"324ded2773c6fadafb0d927addf815db","full_name":"Ashish katewa "},{"user_id":"4c11f67998e31610ff846e28896db538","full_name":"ashish kumar sharma "},{"user_id":"6dd8086fa23bad37580fe55f35509277","full_name":"ashok sharma "},{"user_id":"6ee2a24ca0b81e43100c70235822f48a","full_name":"ashish meena "},{"user_id":"7d15792ada9e5307288fa10cc62b36b9","full_name":"ashish "},{"user_id":"9a212d29e04391f271b924432c5d6c27","full_name":"ashish sharma"},{"user_id":"9def02e6337b888d6dbe5617a172c18d","full_name":"Ashutosh Modi"},{"user_id":"ac074cfba36cddf865ead8bfe0dd2075","full_name":"ashish "},{"user_id":"aedcb718a9b4c9fc0a1aa5331956371a","full_name":"ashok jangir "},{"user_id":"d3c1ac9ac08da86e73258a11a43251af","full_name":"Ashok kumar mehra"}]

从上面的响应中,我只想显示字段 full_name 中的值作为建议。当用户选择其中一个建议值时,我必须将与所选 user_name 关联的 user_id 存储到隐藏字段中。任何人都可以在这方面帮助我吗?在此先感谢。如果您想了解更多关于这个问题的信息,我可以为您提供同样的信息。

4

1 回答 1

0

公平警告我对 PHP 没有任何了解,查看您的代码和您提供的结果,您可以执行以下操作以使自动完成工作。

success: function( data ) { 
    var autoCompleteDataSource = $.map(data, function( item ) {
        return {
            label: item.full_name,
            value: item.user_id
          }
    });
    $(selectorToAutoCompleteInpput).autoComplete({source: autoCompleteDataSource})
}
于 2013-10-05T07:22:09.837 回答