jqueryui 自动完成与类别，格式错误的输入答案

【问题标题】：jqueryui autocomplete with categories, bad formed inputjqueryui 自动完成与类别，格式错误的输入
【发布时间】：2014-01-10 11:19:48
【问题描述】：

我有一个带有自动完成小部件的表单的页面，自动完成在Documentation 中具有以下类别

因为我使用 jquery ui 1.8.12 我将 that._renderItemData( ul, item ); 更改为 that._renderItem( ul, item );

我还需要传递元素的Id，没有名字，我改变了

{ label: "annttop C13", category: "Products" },

到

{value:someIdNumeric, label: "annttop C13", category: "Products" },

当在自动完成中键入一个字母时，似乎效果很好，但不是当我选择一个元素输入时更改为id，例如：

我选择many, Cat: food 输入框显示24 而不是many

我能做到吗？

【问题讨论】：

标签： jquery html jquery-ui autocomplete

【解决方案1】：

就像documentation 所说：

标签属性显示在建议菜单中。当用户选择一个项目时，该值将被插入到输入元素中。

这正是它正在做的事情。它将值插入到您的 id 字段的输入元素中。

如果您需要在他们选择时返回 id 字段，那么您需要使用 select event 将其捕获到另一个字段中：

{id:someIdNumeric, label: "annttop C13", category: "Products" },

$("#your-autocomplete-field").autocomplete({
    source: "your-remote-page.php",
    minLength: 2,
    select: function(event, ui) {
        $('#id-form-field').val(ui.item.id);
        }
    });

如果需要，表单上的字段可以是type="hidden"。

【讨论】：

select 方法不起作用，我有同样的行为，输入有id 而不是label，我将$('#id-form-field').val(ui.item.id); 更改为$('#id-form-field').val(ui.item.label);
@user3100840 $('#id-form-field') 是表单上的一个表单域。将ui.item 转储到控制台，然后查看 select 中的内容。 consol.log(ui.item);