我目前正在开发一个网络应用。首先，我需要的是，当我的html页面加载时，调用对我的servlet的ajax调用，该调用将搜索数据库并作为响应返回表的所有条目作为html表。无论我尝试过什么，这似乎都不起作用，虽然我正在使用一个就绪函数，我在其中进行ajax调用。 其次，当我的html表创建时，会向未验证的条目添加验证按钮。我需要的是当我按下验证按钮来调用我的servlet，更新我的数据库然后刷新我的html表。
adminPage（servlet）
public class AdminPage extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
String result = "";
System.out.print("in get");
try {
// loading drivers for mysql
Class.forName("com.mysql.jdbc.Driver");
// creating connection with the database
Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/ted", "root", "Sk1994!!");
PreparedStatement ps = con.prepareStatement("select * from user");
ResultSet rs = ps.executeQuery();
ResultSetMetaData rsmd = rs.getMetaData();
int numberOfColumns = rsmd.getColumnCount();
int accepted = 0;
result = "<table class='table table-striped'><thead><tr>";
for (int i = 1; i <= numberOfColumns; i++) {
String name = rsmd.getColumnLabel(i);
System.out.println("h sthlh legetai: |" + name + "|");
if (name.equals("accepted"))
accepted = i;
result += "<th>" + name + "</th>";
}
System.out.println("column is: " + accepted);
result += "<th>Verification</th></tr></thead><tbody>";
while (rs.next()) {
boolean verified = true;
result += "<tr>";
for (int i = 1; i <= numberOfColumns; i++) {
result += "<td>" + rs.getString(i) + "</td>";
if (accepted == i)
if (rs.getString(i).equals("0"))
verified = false;
}
if (verified)
result += "<td></td></tr>";
else
result += "<td><button onclick='runPop(this);'>Validate</button></td></tr>";
}
result += "</tbody></table>";
con.close();
} catch (Exception e) {
e.printStackTrace();
}
out.println(result);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
System.out.print("in post");
String uname = request.getParameter("uname");
System.out.println("Arxise");
try {
// loading drivers for mysql
Class.forName("com.mysql.jdbc.Driver");
// creating connection with the database
Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/ted", "root", "Sk1994!!");
PreparedStatement ps = con.prepareStatement("update user set accepted=? where username=?");
String newValue ="1";
ps.setString(1, newValue);
ps.setString(2, uname);
ps.executeUpdate();
} catch (Exception e) {
e.printStackTrace();
}
}
}
我在我的html页面中使用bootstrap和angular，我删除了大多数包含的内容 Js和ajax调用
function myFunction() {
$.ajax({
type: 'GET',
url: '../adminPage',
success: function(data) {
$("#result").html(data);
}
});
}
$(document).ready(function() {
myFunction();
});
function runPop(el) {
var report = el.parentNode.parentNode.cells[1].innerHTML;
$.ajax({
type: 'POST',
url: '../adminPage',
data: {
"uname": report
},
success: function(data) {
$.ajax({
type: 'GET',
url: '../adminPage',
success: function(data) {
$("#result").html(data);
}
});
}
});
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<title>Tempting EveryDay</title>
<!-- Bootstrap Core CSS -->
<link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">-->
<link href="../css/jquery.datetimepicker.min.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="../vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700' rel='stylesheet' type='text/css'>
<!-- Theme CSS -->
<link href="../css/agency.min.css" rel="stylesheet">
<link href="../css/mycss.css" rel="stylesheet">
<link href="../css/agency.css" rel="stylesheet">
</head>
<body>
<div id="result"></div>
<button type="submit" onclick="myFunction();">press me</button>
<!-- jQuery -->
<script src="vendor/jquery/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<!-- Plugin JavaScript -->
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<!-- Contact Form JavaScript -->
<script src="../js/jqBootstrapValidation.js"></script>
<script src="../js/contact_me.js"></script>
<!-- Theme JavaScript -->
<script src="../js/agency.min.js"></script>
<!-- Angular js -->
<script type="text/javascript" src="../js/angular.min.js"></script>
<script type="text/javascript" src="../js/app.js"></script>
</body>
</html>
我想要的输出是这样的： wanted output
我设法通过添加一个按钮来手动执行ajax调用来显示它，但即使这样，当我按下validate按钮时，ajax post也没有完成，并且没有调用servlet。 即使我手动更新数据库，当我刷新页面时，html表也不会更新。
我的要求太多，但每一条线索都能帮到我很多。感谢
