以下是我的showproduct.jsp文件...因此，当我搜索产品时，带有id，ajax部分的div会从searchproduct.jsp加载内容。但是当尝试在ajaxsection div中创建的表单中执行提交时，它无效。
这是我的SHOWPRODUCT.jsp：
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.io.*" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<% String username = (String) session.getAttribute("username");
System.out.println(username);
%>
<center>
<h2 style="color:red;"><% if(request.getParameter("msg")!=null) {
out.println(request.getParameter("msg"));
}%></h2>
<form action="">
Product Search: <input type="text" id="txt1" onkeyup="showproduct(this.value)">
</form>
<h2>Product List </h2>
<div id="ajaxsection"></div>
<table id="productlist" border="1" cellpadding="5">
<tr>
<th>ProductID</th>
<th>ProductName</th>
<th>Price</th>
<th>Available</th>
</tr>
<% PreparedStatement pst = null;
Connection conn = null;
String sql = "";
try {
Class.forName("com.mysql.jdbc.Driver").newInstance();
conn = DriverManager.getConnection("jdbc:mysql://127.0.0.1:3306/shop", "root", "");
sql = "select * from product";
System.out.println("Product List");
pst = (PreparedStatement) conn.prepareStatement(sql);
ResultSet rs = pst.executeQuery();
while (rs.next()) { %>
<% if(rs.getInt("quantity") > 0 ) { %>
<tr>
<form id="forms1" action="AddCart1" method="POST">
<td><%=rs.getString("productid")%></td>
<input type="hidden" name="product" value="<%=rs.getString("productid")%>">
<input type="hidden" name="username" value="<%=username%>">
<input type="hidden" name="uri" value="<%= request.getParameter("uri") %>">
<td><%=rs.getString("productname")%></td>
<td><%=rs.getInt("price")%></td>
<td><%=rs.getInt("quantity")%></td>
<td><input type="submit" value="Add to Cart"></td>
</form>
</tr>
<% }
}
} catch (Exception e) {
e.printStackTrace();
}
finally {
if (conn != null) {
try {
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}%>
</table>
<br><br>
</center>
<script>
function showproduct(str) {
var xhttp;
if (str == "") {
var x = document.getElementById('productlist');
x.style.display = 'inline-block';
document.getElementById("ajaxsection").innerHTML = "";
return;
}
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
var x = document.getElementById('productlist');
x.style.display = 'none';
if (this.readyState == 4 && this.status == 200) {
document.getElementById("ajaxsection").innerHTML = this.responseText;
eval(document.getElementById("runscript").innerHTML);
}
};
xhttp.open("GET", "searchproduct.jsp?name="+str, true);
xhttp.send();
}
</script>
</body>
</html>
这是我的SEARCHPRODUCT.jsp：
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.io.*" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<% String username = (String) session.getAttribute("username");
System.out.println(username);
String s=request.getParameter("name");
%>
<body>
<center>
<h2 style="color:red;"><% if(request.getParameter("msg")!=null) {
out.println(request.getParameter("msg"));
}%></h2>
<table border="1" cellpadding="5">
<tr>
<th>ProductID</th>
<th>ProductName</th>
<th>Price</th>
<th>Available</th>
</tr>
<% PreparedStatement pst1 = null;
Connection conn1 = null;
String sql1 = "";
try {
Class.forName("com.mysql.jdbc.Driver").newInstance();
conn1 = DriverManager.getConnection("jdbc:mysql://127.0.0.1:3306/shop", "root", "");
sql1 = "select * from product";
System.out.println("Product List");
pst1=conn1.prepareStatement("select * from product where productname LIKE ?");
s+="%";
pst1.setString(1,s);
ResultSet rs1 = pst1.executeQuery();
while (rs1.next()) { %>
<% if(rs1.getInt("quantity") > 0 ) { %>
<tr>
<form id="forms" action="AddCart1" method="POST">
<td><%=rs1.getString("productid")%></td>
<input type="hidden" name="product" value="<%=rs1.getString("productid")%>">
<input type="hidden" name="username" value="<%=username%>">
<input type="hidden" name="uri" value="<%= request.getParameter("uri") %>">
<td><%=rs1.getString("productname")%></td>
<td><%=rs1.getInt("price")%></td>
<td><%=rs1.getInt("quantity")%></td>
<td><input type="submit" value="Add to Cart"></td>
</form>
</tr>
<% }
}
} catch (Exception e) {
e.printStackTrace();
}
finally {
if (conn1 != null) {
try {
conn1.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}%>
</table>
<br><br>
</center>
<script type="text/javascript" id="runscript">
alert("running from mainssss");
//document.getElementById("forms").submit();
var f = document.getElementById("forms");
f.onsubmit = function (e){
alert("running from mainssss111");
if(document.getElementById("forms")!=null)
document.getElementById("forms").submit();
e.preventDefault();
console.log(f.name.value);
}
</script>
</body>