2

ff 示例来自http://jqueryui.com/autocomplete/

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Autocomplete - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
  $(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"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  });
  </script>
</head>
<body>

<div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags" />
</div>


</body>
</html>

在这个例子中，我想将它应用到我的 ASP.NET 项目中。

我担心的是，是否可以将“availableTags”的内容从后面的代码中放入变量中？如果是，那么我如何将它连接到此代码以完成相同的事情？

我会很感激你的帮助。

谢谢！

4

2 回答 2

6

ASPX 页面的脚本部分：

<script>
$(function() {
  var availableTags = [
    <%= GetAvailableTags() %>
  ];
  $( "#tags" ).autocomplete({
    source: availableTags
  });
});
</script>

后面的代码：

public string GetAvaliableTags()
{
    var tags = new[] { "ActionScript", "Scheme" };
    return String.Join(",", tags.Select(x => String.Format("\"{0}\"", x)));
}

这GetAvailableTags()函数的输出将在渲染时直接写入页面。

这当然是一个“快速而肮脏”的解决方案。例如，如果您的自动完成项目包含引号等特殊字符，则您必须采取不同的方法。

于 2013-09-10T02:03:59.803 回答
4

您可以使用 ASP.NET AJAX 页面方法作为通过 jQuery 调用的服务器端的管道来检索 列表availableTags，如下所示：

<script>
    $(document).ready(function() {
        $("#tags").autocomplete({
            source: function(request, response) {
                $.ajax({
                    type: "POST",
                    url: "YourPage.aspx/GetAutoComplete",
                    data: "{}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function(msg) {

                    }
                });
            }
        });
    });
</script>

现在在代码隐藏中YourPage.aspx，创建页面方法，如下所示：

[WebMethod]
public static string[] GetAutoComplete()
{
    return new[]
    {
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    };
}
于 2013-09-10T02:05:10.333 回答