kendoAutoComplete在单击模板或项目时显示[对象对象]

时间:2013-04-19 11:03:22

标签: kendo-ui kendo-grid

此代码在快照中返回以下结果。

如何在点击模板而不是[object object]时使用FirstName和LastName填充文本字段?

function forAutoComplete(FieldName){
        var autoCompleteUsers = $("#employees").kendoAutoComplete({
            minLength: 1,
            dataTextField: FieldName,

            template: '<div style="border-bottom: 1px solid DARKGRAY; padding:10px 0; clear:both;">' +
                      '<img  style="float:left; margin-right:20px;" width=\"127\" height=\"127\" src=\"<?php echo base_url() ?>/user_uploads/employee_images/${data.Photo}\" alt=\"${data.Photo}\"/>'+
                      '<div style="display: inline-block;"><p>${ data.FileNo}</p>' +
                      '<h3>${ data.FirstName } ${ data.LastName }</h3></div>'+
                      '<div style="clear: both; "></div></div>',

            dataSource: {
                serverFiltering: true,
                transport: {
                    read: {
                        type: "GET",
                        dataType: "json",
                        contentType:'application/json; charset=utf-8',
                        url: "<?php echo base_url() ?>index.php/hr_management/manage_hr/search_employee/",
                        data: function (arg){
                            return {FieldName : autoCompleteUsers.data("kendoAutoComplete").value()};
                        }
                    }
                }
            },
            height: 300,
            change: onChangeAutoComplete
        });
    }

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:4)

问题可能与您为dataTextField设置的值有关。

进行一些逆向工程,我猜你返回的JSON数据是这样的:

[
    {data: { FileNo: "0001", FirstName: "OnaBai", LastName: "it's me", Photo: "https://si0.twimg.com/profile_images/2648375258/7f7e451f0de1eb467fe35f4f481d7bf7_bigger.jpeg" } },
    {data: { FileNo: "0002", FirstName: "Burke", LastName: "Holland", Photo: "https://si0.twimg.com/profile_images/3342899483/51e933d69222ce8ad8cd14e655116959.jpeg" } },
    {data: { FileNo: "0003", FirstName: "Todd", LastName: "Anglin", Photo: "https://si0.twimg.com/profile_images/1478082886/todd-anglin-close-up_illustrated.png" } }
]

如果是这样,您应该将其定义为data.FirstName

如果您将其定义为:

[
    { FileNo: "0001", FirstName: "OnaBai", LastName: "it's me", Photo: "https://si0.twimg.com/profile_images/2648375258/7f7e451f0de1eb467fe35f4f481d7bf7_bigger.jpeg" },
    { FileNo: "0002", FirstName: "Burke", LastName: "Holland", Photo: "https://si0.twimg.com/profile_images/3342899483/51e933d69222ce8ad8cd14e655116959.jpeg" },
    { FileNo: "0003", FirstName: "Todd", LastName: "Anglin", Photo: "https://si0.twimg.com/profile_images/1478082886/todd-anglin-close-up_illustrated.png" }
]

然后它应该只是FirstName

here中的第一种方法示例,here

中的第二种方法示例

如果您定义dataTextField: "data",并使用第一种方法获得JSON,那么您将获得[object Object]。见here