jQuery自动完成类别选择标签和值

Question

尝试使用类别获取jQuery自动完成功能,将选定的值返回到搜索字段,将值返回到单独的输入字段.

我已将数据修改为具有值以及标签和类别.

见http://jsfiddle.net/chrisk/bM7ck/

但是值始终返回到搜索字段而不是标签.

Answer 1

这就是当你提供标签和值时jquery ui自动完成的工作方式.如果要将标签返回到搜索字段,请重命名值字段.

更新小提琴:http://jsfiddle.net/jensbits/bM7ck/3/

Answer 2

你很亲密,你只需要:

1. 添加return false到select事件处理程序的末尾,和
2. 为事件添加事件处理程序,focus以便您也可以使用标签而不是值来覆盖它.

这是你的代码更新:

$("#search").catcomplete({
    delay: 0,
    source: data,
    select: function(event, ui) {
        $('#search').val(ui.item.label);
        $('#searchval').val(ui.item.value);
        return false; // Prevent the widget from inserting the value.
    },
    focus: function(event, ui) {
        $("#search").val(ui.item.label);
        return false; // Prevent the widget from inserting the value.
    }
});

这是一个更新的例子:http://jsfiddle.net/q2kDU/