jquery 如何将dataSource的返回Map到Kendo自动完成UI

lztngnrs  于 2023-02-18  发布在  jQuery
关注(0)|答案(1)|浏览(114)

我有一个Kendo jquery自动完成UI组件,它有一个远程REST Web API数据源。我想将API的响应Map到自动完成。我让它显示选项,但当我检查select函数时,我只看到我选择了什么。我想要的是select事件上的完整json对象。或者至少我真正需要的是unitKey属性。
我的代码:

//create AutoComplete UI component
    $("#autoAddress").kendoAutoComplete({
        minLength: 3,
        dataTextField: "address",                
        filter: "startswith",
        placeholder: "Address lookup ...",            
        select : function(e) {
            var item = e.item;
            console.log(item.text());
        },
        dataSource: new kendo.data.DataSource ({   
            serverFiltering: true,
            transport: {
                read: {
                    url: "https://testapi.mydomain.com/homeinfo/api/address/",
                    // dataType: "jsonp",
                    data: {
                        q : function() {
                            return $("#autoAddress").data("kendoAutoComplete").value();
                        },                                
                        maxRows: 30
                    }
                }
            },
            schema : {
                data: function(response){
                    return response;
                }
            }                              
        })
    });

来自API调用的样本日期:

[
    {
        "unitKey": "S37.75      ",
        "address": "1234 ADDISON AVE"
    },
    {
        "unitKey": "S22.215     ",
        "address": "1234 AUGUSTINE DR"
    },
    {
        "unitKey": "L100.9      ",
        "address": "1234 AVENIDA DE LAS CASAS"
    }
]

当用户从autocomplete组件中进行选择时,我尝试获取"unitKey"。

y53ybaqx

y53ybaqx1#

您希望查看e.dataItem而不是e.item:

console.log(e.dataItem.unitKey);

在这种情况下,我通常会将“e”本身记录到控制台或断点,并使用调试器检查它,看看它包含了什么,因为文档并不总是像它所能做到的那样全面。

相关问题