类似谷歌的下拉搜索从Asp.Net的数据库中填充

本文关键字：Net Asp 数据库 填充 搜索 谷歌 | 更新日期: 2023-09-27 17:59:15

我正在寻找一种简单但有效的方法来创建一个下拉搜索框，该搜索框应该像谷歌搜索一样工作，并由数据库中的值填充，当我在文本框中键入任何内容时，该数据库会起作用。I应该可以选择任何值。我正在寻找最简单的解决方案，不想像我看到的每个例子那样使用web服务或ajax控制工具包。如有任何帮助，我们将不胜感激。。

类似谷歌的下拉搜索从Asp.Net的数据库中填充

您正在寻找类似JQuery的自动完成功能，可在此处找到：https://jqueryui.com/autocomplete/

如果你不想使用AJAX查询来进行搜索，如果你愿意，你可以在HTML中包含所有数据。不过，我不建议这样做，因为如果你的访客查看你的来源，这些信息也可以公开显示。如果这不是问题，那就一定要走这条路。

如果您确实想通过AJAX加载数据，我链接到的Autocomplete也可以针对远程数据源工作。相关文档如下：https://jqueryui.com/autocomplete/#remote

不使用远程数据源（无ajax）的示例：

$(function() {
var availableTags = [
  "ActionScript",
  "AppleScript",
  "Asp",
  "BASIC",
  "C",
  "C++",
  "Clojure",
  "COBOL",
  "ColdFusion",
  "Erlang",
  "Fortran",
  "Groovy",
  "Haskell",
  "Java",
  "JavaScript",
  "Lisp",
  "Perl",
  "PHP",
  "Python",
  "Ruby",
  "Scala",
  "Scheme"
];
$( "#birds" ).autocomplete({
  source: availableTags
});

在这个例子中，您必须想办法将所有标签打印到上面的HTML中，因为您显然无法对其进行硬编码。如何做到这一点，取决于你运行的技术。（MVC，WebForms，…）。但你通常只需要从数据库中获取所有标签，并将它们打印到javascript中。如果你需要一个例子，请发回来告诉我你的技术，我会更新我的答案。

远程数据源示例（使用ajax）：

$( "#birds" ).autocomplete({
  source: "/api/GetValuesForAutocomplete", //the url to query 
  minLength: 2 //the amount of letters the user has to type before the search begins
});
 //in your HTML you would have: 
<input id="birds" />

你可以在他们的网站上找到更完整的例子。您必须使用这样一个ajax查询的URL取决于您的网站是用什么技术编写的。您是否可以访问WEB API项目？还是MVC网站？还是Webforms网站？

相关文章：