jquery UI自动完成下拉列表未显示

时间:2011-08-27 23:13:38

标签: jquery jquery-ui autocomplete jquery-ui-autocomplete

我正在使用jquery UI自动完成,由于某种原因我无法弄清楚为什么下拉列表没有显示出来。我已经尝试了所有我能想到的没有运气的东西......我希望有些人可以帮助我。 Firebug从我的PHP脚本中显示正确的JSON输出。

成功时的警报(数据)显示:[object Object]

HTML代码

<select name=key1 id=key1>
  <option selected value="">CHOOSE ONE </option>
  <option value="allrecs">ALL RECORDS <</option>
  <option value="citnumb">CIT NUMBER <<option>
  <option value="sernumb">SERIAL NUMBER </option>
  <option value="model">MODEL </option>
</select>

<input type="text" size=30 name="qvalue" id="qvalue">

JQUERY脚本

$("#qvalue").autocomplete(  
{
  source: function(request, response) 
  {
    $.ajax(
    {
      url: "jqsuggest2.php",
      type: "POST",
      dataType: "json",
      data:{term: request.term,searchkey:$('#key1').val()
    },
    success: function(data) 
    {
      alert(data);
      response( $.map( data, function(item) 
      {
         return 
         {
            value: item.term
         }
       }));
                }
        });
  },
  minLength: 2

});

PHP脚本

        $json = '[';
        $first = true;

        while($row = mysql_fetch_array($result)) 
        {
            if (!$first)
            { 
                $json .=  ','; 
            }
            else
            {
                $first = false; 
            }

            if ($searchkey == "citnumb")
            {
                $json .= '{"value":"'.$row['citnum'].'"}';
            }
            if ($searchkey == "sernumb")
            {
                $json .= '{"value":"'.$row['sernum'].'"}';
            }
            elseif ($searchkey == "model")
            {
                $json .= '{"value":"'.$row['model'].'"}';
            }

        }
        $json .= ']';
        echo $json;
        }

Firebug输出 [{“value”:“28225”}]

非常感谢任何帮助 由于
克里斯

2 个答案:

答案 0 :(得分:0)

您需要将数组添加到source选项。我相信如果你在map函数中更改return语句,你应该设置为go。所以,改变

return 
{
    value: item.term
}

return item.source

答案 1 :(得分:0)

$.map用于将一个数组转换为另一个数组。在自动完成小部件的上下文中,它用于以自动完成小部件期望的格式将源数组转换为数组。

在你的情况下,看起来就像你的php正在返回一个包含如下结构的对象的数组:

[{ "value": "1234"}, ... ]

原来这是一个有效的自动完成数组。您不应该需要任何后期处理。换句话说,这应该适合你:

$("#qvalue").autocomplete(  
{
  source: "jqsuggest2.php",
  minLength: 2
});

实际上,您可以缩短PHP以返回一个字符串数组:

["1234", "4567", "89101"]

这也是一个有效的自动填充数组。