如何在 autocomplete() 方法上显示 Jquery UI 自动完成小部件?

发布于 2024-11-04 05:00:15 字数 1228 浏览 11 评论 0原文

我希望有人可以帮助解决这个问题,
我很难让 jQueryUI 的自动完成功能与 asp.net 应用程序中的 $.ajax({}) 调用一起使用。< br> 我可以让它进行 ajax 调用,我正在从服务和位置列表中获取响应。
但仍然没有显示自动完成列表,当我按向下箭头键时,位置列表将呈现在页面上。
从 Web 方法获取位置列表后应立即呈现/显示它。怎么可能?

我正在使用 jquery 站点的自动完成功能:http://jqueryui.com/demos/autocomplete/

示例代码

function GetCitiesLikeList(objcity) {    
var cities = "";
        $.ajax({
            type: "POST",
            url: http://localhost/testweb/location.asmx/Getlocations,
            data: "{ City : '" + objcity + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg.d != null && msg.d != "") {
                    cities = "";
                    cities = msg.d;
                    $("#citilist").autocomplete({
                        source: cities
                    });
                }
                else
                    $("#citilist").attr("autocomplete", "off")
            },
            error: function (xhr, ajaxOptions, thrownError) { return false; }
        }); 
}

I'm hoping someone can help with this,
I'm having a really difficult time getting jQueryUI's autocomplete to work with $.ajax({}) call in an asp.net application.
I can get it to make the ajax call, am getting response from service and the list of the locations.
but still the autocomplete list is not shown, when I press the down arrow key then location list is rendered on the page.
It should be rendered/shown immediately after getting the list of locations from web method. How could it be possible?

I'm using autocomplete from jquery site: http://jqueryui.com/demos/autocomplete/

Sample Code

function GetCitiesLikeList(objcity) {    
var cities = "";
        $.ajax({
            type: "POST",
            url: http://localhost/testweb/location.asmx/Getlocations,
            data: "{ City : '" + objcity + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg.d != null && msg.d != "") {
                    cities = "";
                    cities = msg.d;
                    $("#citilist").autocomplete({
                        source: cities
                    });
                }
                else
                    $("#citilist").attr("autocomplete", "off")
            },
            error: function (xhr, ajaxOptions, thrownError) { return false; }
        }); 
}

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

随波逐流 2024-11-11 05:00:15

我找到了另一种触发 jQuery UI 自动完成功能的方法,无需在框中输入内容:

$('#field').autocomplete({
    source: '/path/to/data',
    minLength: 0
});
$('#button').click(function() {
    $('#field').autocomplete('search', '')
});

发送“搜索”参数会触发搜索功能。第二个参数是发送到 /path/to/data 处的数据处理程序的“术语”。

I found another way to trigger the jQuery UI autocomplete functionality, without typing into the box:

$('#field').autocomplete({
    source: '/path/to/data',
    minLength: 0
});
$('#button').click(function() {
    $('#field').autocomplete('search', '')
});

Sending the 'search' arg triggers the search functionality. The second argument is the "term" sent to the data handler at /path/to/data.

玩物 2024-11-11 05:00:15

要显示列表,只需调用 $('#citilist').trigger("keydown");
这使它认为您正在输入 citilist 输入,并将触发 ajax 帖子。

To show the list just call $('#citilist').trigger("keydown");
This makes it think you are typing in the citilist input, and will trigger the ajax post.

丢了幸福的猪 2024-11-11 05:00:15

仅当按下按键时才会触发 Jquery 自动完成,这就是您所发生的情况。这就是它的设计目的。如果你想定制的话。你应该写你自己的逻辑。

Jquery autocomplete is triggered only when a key is struck, That's what is happening with you. That's the functionality it is designed for. If you want to customise that. You should write your own logic.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文