如何使用ASP.NET MVC和jQuery(非自动完成)提供实时过滤结果的文本框?

时间:2021-12-06 09:43:55

I'm looking to something similar to how the * Users page allows you to type in a username and it filter the users below in real time.

我正在寻找类似于*用户页面允许您输入用户名的内容,它会实时过滤下面的用户。

如何使用ASP.NET MVC和jQuery(非自动完成)提供实时过滤结果的文本框?

I'm using ASP.NET MVC and jQuery. Can someone point me to a simplified example that uses this technology stack to do the same thing?

我正在使用ASP.NET MVC和jQuery。有人能指出我使用这个技术堆栈做同样事情的简化例子吗?

1 个解决方案

#1


3  

You basically need an ajax call made each time the value of the textbox changes.

每次文本框的值发生变化时,您基本上都需要进行ajax调用。

Totally untested, but something along the lines of:

完全没有经过测试,但有些东西:

$("#inputName").change(function () {
    // maybe check the value is more than n chars or whatever
    $.ajax({
        url: <%= Url.Action("Lookup", "Users") %> + '/' + this.val(), // path to ajax request
        dataType: "html", // probably
        success: updateContainerWithResults
    });
});

function updateContainerWithResults(data) {
    $("#resultsContainerElement").html(data);
}

http://docs.jquery.com/Events/change

http://docs.jquery.com/Events/change

http://docs.jquery.com/Ajax

http://docs.jquery.com/Ajax

#1


3  

You basically need an ajax call made each time the value of the textbox changes.

每次文本框的值发生变化时,您基本上都需要进行ajax调用。

Totally untested, but something along the lines of:

完全没有经过测试,但有些东西:

$("#inputName").change(function () {
    // maybe check the value is more than n chars or whatever
    $.ajax({
        url: <%= Url.Action("Lookup", "Users") %> + '/' + this.val(), // path to ajax request
        dataType: "html", // probably
        success: updateContainerWithResults
    });
});

function updateContainerWithResults(data) {
    $("#resultsContainerElement").html(data);
}

http://docs.jquery.com/Events/change

http://docs.jquery.com/Events/change

http://docs.jquery.com/Ajax

http://docs.jquery.com/Ajax