假设数据库中有商品表t-goods ,包括商品id ,商品名称name,商品价格price,根据下列要求和提示写出相应的部分代码,编写商品名称模糊查询界面,能够在当前页面显示商品名称和价格,要求采用Ajax和Servlet 技术实现后天业务逻辑
时间: 2024-01-18 12:03:03 浏览: 151
好的,我理解了你的问题。针对你的要求,我可以提供以下代码示例:
在前端页面中,使用HTML和JavaScript实现商品名称模糊查询界面,其中包括输入框和按钮:
```html
<input type="text" id="goodsName" placeholder="请输入商品名称">
<button onclick="searchGoods()">查询</button>
<div id="result"></div>
```
其中,输入框的id为“goodsName”,按钮的点击事件绑定了JavaScript函数“searchGoods()”,查询结果将在id为“result”的div中显示。
接下来,使用Ajax技术向后台Servlet发送请求,查询满足条件的商品信息。在JavaScript中定义searchGoods()函数:
```javascript
function searchGoods() {
var goodsName = document.getElementById("goodsName").value;
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var result = JSON.parse(xhr.responseText);
var html = "";
for (var i = 0; i < result.length; i++) {
html += "<p>" + result[i].name + ":" + result[i].price + "</p>";
}
document.getElementById("result").innerHTML = html;
}
};
xhr.open("GET", "searchGoods?goodsName=" + goodsName, true);
xhr.send();
}
```
其中,首先获取输入框中的商品名称,然后使用XMLHttpRequest对象向后台Servlet发送GET请求,查询指定商品名称的商品信息。后台Servlet的URL为“searchGoods”,并且通过URL参数“goodsName”传递商品名称参数。请求完成后,将查询结果解析为JSON格式,并且遍历结果数组生成HTML代码,最后将结果显示在前端页面中。
在后台Servlet中,可以通过以下代码实现商品名称模糊查询功能:
```java
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String goodsName = request.getParameter("goodsName");
List<Map<String, Object>> list = searchGoods(goodsName);
String result = JSONArray.toJSONString(list);
response.setContentType("application/json;charset=UTF-8");
response.getWriter().write(result);
}
private List<Map<String, Object>> searchGoods(String goodsName) {
List<Map<String, Object>> list = new ArrayList<>();
String sql = "SELECT name, price FROM t_goods WHERE name LIKE ?";
try (Connection conn = dataSource.getConnection();
PreparedStatement pstmt = conn.prepareStatement(sql)) {
pstmt.setString(1, "%" + goodsName + "%");
try (ResultSet rs = pstmt.executeQuery()) {
while (rs.next()) {
Map<String, Object> map = new HashMap<>();
map.put("name", rs.getString("name"));
map.put("price", rs.getDouble("price"));
list.add(map);
}
}
} catch (SQLException e) {
e.printStackTrace();
}
return list;
}
```
其中,首先从请求参数中获取商品名称,在searchGoods()方法中执行SQL查询操作,查询满足商品名称模糊匹配的商品信息,并且将结果存储到List<Map<String, Object>>中。查询结果使用JSON格式序列化后,通过response对象返回前端页面。需要注意的是,在Servlet中需要使用JDBC技术访问数据库,这里使用了JDBC连接池技术,可以根据实际情况选择不同的连接池实现。
阅读全文