Question

首先，抱歉这个问题的标题。我想了很长时间，并没有做得更好。

我的问题是：jQueryUI的自动完成功能是否可以在一个自动填充字段下提供来自多个数据库字段的建议。例如，我希望能够在字段中键入“br”并将“briman057”和“Brian Johnson”显示为建议，即使它们存储在单独的数据库字段中并作为两个单独的键值返回一对相同的JSON项（即[{username：briman057，name：'Brian Johnson']}）。然后，我希望用户名值是在选择它或全名时填充该字段的值。我知道其中一个键需要命名为“value”或“label”，并且该名称的键是用于提供建议的键，但是对于一个JSON项，我基本上可以有两个“值”键吗？

Answer 1

是的，它可以，因为您提供自己的自定义回调作为数据源。该回调可以实现您想要的行为。

这是我想你想要的演示。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/ui-lightness/jquery-ui.css" type="text/css" media="all" />
<script type="text/javascript">
$(function() {
  $('#myautocomplete').autocomplete({
    source: function(request, response) {
      // TODO: make suggestions actually depend on what the user types into the search box.

      // You want two suggestions, one with 'briman57' and one with 'Brian Johnson', so we need two suggestions with different labels, but with the same value.
      var suggestions = [
        { label: 'briman057'    , value: 'briman057', username : 'briman057', name : 'Brian Johnson'},
        { label: 'Brian Johnson', value: 'briman057', username : 'briman057', name : 'Brian Johnson'}
      ];
      response(suggestions);
    },
    select: function( event, ui ) {
      alert('You have selected ' + ui.item.name + ' (' + ui.item.username + ')');
    }
  });
});
</script>
<input id="myautocomplete" title="Enter anything here."></input>

查看Remote JSONP datasource example的源代码，获取更多灵感。

对一个字段下的多个值的建议 - jQueryUI自动完成

1 个答案: