Question

我一直试图让这个工作几天，而且我没有得到任何代码。我的表单有一个文本框，需要列出我尝试使用自动完成的外部销售人员。

这是表单的代码（doorform2.jsp）

<script>
    $("#outsideSales").autocomplete({source: "outsideIn.jsp",minLength: 2});
</script>

<input type="text" name="outsideSalesman" id="outsideSales" required>

这是我用来从我的数据库中获取数据以用于自动完成的代码

<%
Connection con = null;
Statement stmt = null;
ResultSet rs = null;

Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver");
con = DriverManager.getConnection("jdbc:sqlserver://nemesis:1433;instanceName=gfi;databaseName=NationalFormsRepository;user=portal;password=P0rtal");
stmt = con.createStatement();

String outside = request.getParameter("outsideSalesman");

ArrayList<String> outsideSalesmenNames = new ArrayList<String>();
String outsideSalesman = "SELECT outsideSalesName FROM tbl_outsideSales WHERE outsideSalesName like '%"+outside+"%'";

rs = stmt.executeQuery(outsideSalesman);

while(rs.next())
{
    outsideSalesmenNames.add(rs.getString("outsideSalesName"));
}
out.println(outsideSalesmenNames);

%>

我曾尝试在线学习几个教程，但我一直关注的大多数教程都是针对php而不是jsp，或者是针对旧版本的jquery自动完成。我觉得我错过了一些小东西，但一直看着它很久才看到它。任何人都可以看看我是否遗漏了什么？

Answer 1

您的 outsideIn.jsp 必须返回 JSON 格式化数据。

来自官方文档：“数据源是一个服务器端脚本，它返回JSON数据，通过source-option的简单URL指定。此外，minLength-option设置为2以避免查询将返回太多结果，select-event用于显示一些反馈。“

请点击此处查看更多信息：link

干杯：）

Answer 2

首先，您的代码未包含在$(document).ready()中。以下内容无法按预期工作：

<script>
$("#outsideSales").dosomething();
</script>
<!-- Note: #outsideSales does not exist before this line -->
<input id="outsideSales">

修改你的代码：

<script>
$(document).ready(function(){
    $("#outsideSales").dosomething();
});
</script>
<input id="outsideSales">

＃2：当您指定URL作为源参数时，jQuery UI将发送包含查询字符串参数term的请求。因此，您需要相应地修改代码：

String outside = request.getParameter("term");

＃3：jQuery UI需要有效的 JSON而不是字符串。所以不要这样：

[Jack, Jill, John]

您的程序需要输出：

["Jack", "Jill", "John"]

PS：您的查询对SQL注入开放。

使用JSP + AJAX使用数据库中的数据填充jQuery UI自动完成

2 个答案: