Question

我在对话框中有一个表单，当用户单击按钮时会显示该表单。当用户开始在一个字段内绑定时，我想显示在数据库中找到的可用选项。

需要使用AJAX请求读取可用选项。

这是我的jQuery代码，我尝试初始化autocomplete()

$("#icwsTransferTo")
// don't navigate away from the field on tab when selecting an item
.bind( "keydown", function( event ) {
    if ( event.keyCode === $.ui.keyCode.TAB &&
        $( this ).autocomplete( "instance" ).menu.active ) {
      event.preventDefault();
    }
  }).autocomplete({
    source: function(request, response) {

        $.ajax({    
            type: 'GET',
            url: 'index.php',       
            data: {method: 'userSearch', term: request.term},
            dataType: 'json',
            cache: false,
            timeout: 30000,
            success: function(data) { 
            console.log(data);
                if(!data){
                    return;
                }


                var array = $.map(data, function(m) {
                return {
                        label: '<div syle="display: block;"><span>' + m.configurationId.displayName + '</span><span style="float: right"> (' + m.extension + ')</span></div>'
                    };
                });
                response(array);

            }
        }); 

    },
    search: function() {
        // custom minLength
        var term = extractLast( this.value );
        if ( term.length < 2 ) {
            return false;
        }
    },
    focus: function() {
        // prevent value inserted on focus
        return false;
    },
    select: function( event, ui ) {

        alert('Worked!');

    }
});

字段icwsTransferTo位于对话框中显示的表单内部。

问题在于，当输入2个以上的字符时，我会在字段中看到旋转图标但是没有显示任何结果。

当我对index.php?method=userSearch&term=mike进行手动调用时，我会得到这样的结果

stdClass Object
(
    [items] => Array
        (
            [0] => stdClass Object
                (
                    [configurationId] => stdClass Object
                        (
                            [id] => msmith
                            [displayName] => Mike Smith
                            [uri] => /configuration/users/msmith
                        )

                    [extension] => 2062
                )

            [1] => stdClass Object
                (
                    [configurationId] => stdClass Object
                        (
                            [id] => mjohns
                            [displayName] => Mike Jones
                            [uri] => /configuration/users/mjohns
                        )

                    [extension] => 2083
                )
        )
)

我在这里做错了什么？为什么结果没有显示？

Answer 1

我假设您正在使用Jquery UI自动完成功能？根据他们在这里的文档：Documentation你应该传递一个JSON数组而不是html。

如何使用jQuery在对话框中使用自动完成？

1 个答案: