jQuery UI自动完成中的自定义属性问题 [英] Issue with custom properties in jQuery UI Autocomplete

问题描述

在使用jQuery UI的自动完成功能时，我遇到了自定义属性的问题。出于某些奇怪的原因，自动完成功能将不允许我使用 ui.item.make 或 ui.item.id的make或id属性，但在设置为 ui.item.label 时正在工作。

I'm running into an issue with custom properties while using jQuery UI's autocomplete functionality. For some strange reason, the autocomplete function will not allow me to use the make or id attribute for ui.item.make or ui.item.id, but is working when it is set to ui.item.label.

这是 JSFiddle ，其中包含我遇到的问题的示例。这是另一个示例自动完成工作的位置，但不同之处仅在于标签属性。

Here is JSFiddle with an example of the issue I am encountering. Here is another example of where autocomplete is working, but the difference is only the label property.

为什么使用自定义属性对我不起作用的任何信息都将不胜感激。

Any information why using a custom property doesn't work for me would be greatly appreciated.

推荐答案

您可以简单地预处理品牌列表（请参阅forEach） - 如果您通过ajax获取数据，您也可以执行类似的操作。注意：我还在您的选择中添加了 return false ，因此它不会使用该值而是使用您的make。

You could simply pre-process the list of makes (see the forEach) - IF you get your data via ajax, you could also do something similar. NOTE: I also added return false to your select so it would not use the value and use your make instead.

var carMake = [{
    "make": "Smart",
        "id": '200038885'
}, {
    "make": "Bomb",
        "id": '200038885'
}, {

    "make": "Volkswagen",
        "id": '200000238'
}];

function addlabel(row) {
    row.label = row.make;
    row.value = row.id;
}
carMake.forEach(addlabel);
$("#vehicle_make").autocomplete({
    source: carMake,
    delay: 0,
    minLength: 1,
    autoFocus: false,
    select: function (event, ui) {
        $(this).val(ui.item.make);
        return false;
    }
});

编辑：Ajax数据说明：要使用ajax数据进行处理，这将是一种方法：

Ajax data note: to process using ajax data, this would be a method:

success: function (data) {
    response($.map(data, function (item) {
        return {
                 label: item.make
                 value: item.id,
                 make: item.make,
                 id: item.id
               }
    }))
}, 

这篇关于jQuery UI自动完成中的自定义属性问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！