JQuery UI:自动完成。对选择做出反应

时间:2013-02-23 13:11:21

标签: jquery select user-interface autocomplete

我在互联网上找到了几个例子,但它们对我不起作用。 我试图选择一个jquery ui自动完成框。 我设法有一个有效的结果回调,但是当我点击一个条目时,不会触发select事件。 我的代码如下所示:

     select: function( event, ui ) 
     {
         alert( ui.item.value);
     }

响应来自PHP文件。我尝试使用通常的JSON数组,只使用结果的名称,在互联网上进行一些研究后,我将其更改为一个如下所示的数组:

[{"id":0,"label":"Pinocchio","value":"Pinocchio"}]

但这对我也不起作用。那有什么不对呢?

[编辑]: 在视图中:

$('#search').autocomplete
    ({
       source:
        function(request, response)
        {
        var input = $('#search').val();
        $.ajax(
        {
                type: 'POST',
                url: '".CController::createUrl('autoComplete')."',
                data:
                {
                    string: input
                },
                success:
                        function (data)
                        {
                            response(data);
                        },
                dataType: 'json',
                 select: function( event, ui ) {
                 alert( ui.item.value);
                }
        });
        }
    })

是的,阵列看起来像我上面发布的那样。但即使它看起来像[“value1”,“value2”],也不会触发select事件。奇怪的是结果显示但是选择没有效果。 因此要么它是自动完成的选择部分,要么数组没有正确的形式。但它需要某种形式吗?

1 个答案:

答案 0 :(得分:1)

selectautocomplete而不是ajax

的事件
$('#search').autocomplete ({
    source: function(request, response) {
        var input = $('#search').val();
        $.ajax(  {
            type: 'POST',
            url: '".CController::createUrl('autoComplete')."',
            data:{
                    string: input
            },
            success: function (data) {
                response(data);
            },
            dataType: 'json'
        });
    },
    select: function( event, ui ) {  //<<---- This should be passed to the `autocomplete` configuration
        alert( ui.item.value);
    }
})