我试图通过使用jquery调用rest web service来删除行。在url字段中,我不得不在jquery中提到d。这是我的代码
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Employee List</title>
</head>
<body>
<form id = "add">
<h1>Add Employee</h1><br>
<table>
<tr><td>Id : </td><td><input type="text" id="empId" disabled="true" readonly = "true" /></td></tr>
<tr><td>Name : </td><td><input type="text" id="name" /></td></tr>
<tr><td>Age : </td><td><input type="text" id="age" /></td></tr>
<tr><td>Salary : </td><td><input type="text" id="salary" /></td></tr>
<tr><td>Address : </td><td><input type="text" id="address" /></td></tr>
<tr><td><input type = "submit" value = "submit" ></td></tr>
</table></form>
<form id= "list">
<h1>Employee List</h1>
<table id= "content" border= "0">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Age</th>
<th>Salary</th>
<th>Address</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody id = "emp">
</tbody>
</table>
</form>
<script>
$(document).ready(function(){
listEmployee();
addEmployee();
deleteEmployee();
});
function listEmployee(){
$.ajax({
url: '/Ram/rest/restemployees',
type: 'GET',
dataType: 'JSON',
success: function(data){
$.each(data, function(i,value){
$("#content tbody").append("<tr>" + "<td>" + value.id + "</td>" +
"<td>" + value.name + "</td>" +
"<td>" + value.age + "</td>" +
"<td>" + value.salary + "</td>" +
"<td>" + value.address + "</td>" +
"<td>" + "<button onClick='deleteEmployee()'>Edit</button" + "</td>" +
"<td>" + "<button id='btnDel'>Delete</button>" +"</tr>")
});
},
error: function(data){
}
});
}
function addEmployee(){
$("#add").submit(function(e){
var employee = new Object();
employee.name = $("#name").val();
employee.age = $("#age").val();
employee.salary = $("#salary").val();
employee.address = $("#address").val();
e.preventDefault();
$.ajax({
url : "/Ram/rest/add",
type : "POST",
data : employee,
success : function(data){
location.reload(true);
},
error : function(data){
}
});
});
}
function deleteEmployee(){
var employee = new Object();
employee.id = $("#empId").val();
var id = $("#empId").val();
$.ajax({
url : "/Ram/rest/delete/" + id ,
type : "GET",
data: employee,
success: function(data){
alert("2");
location.reload(true);
},
error : function(data){
}
});
}
</script>
</body>
</html>
但是url不接受id值。如何动态传递url值?
答案 0 :(得分:0)
您需要删除数据,然后尝试检查以下代码: 并且网址不正确网址应为:&#34;网址:&#34; / Ram / rest / delete?id =&#34; + id,&#34;
function deleteEmployee(){
//var employee = new Object();
var id = $("#empId").val();
$.ajax({
url : "/Ram/rest/delete?id=" + id ,
type : "GET",
dataType: "html",
data: 'json',
cache: false,
//data: employee,
success: function(data){
alert("2");
location.reload(true);
},
error : function(data){
}
});
}
第二种可能的方式:
var employee = {
"id": $("#empId").val()
}
$.ajax({
url: "/Ram/rest/delete/",
type: "GET",
dataType: "html",
data: 'json',
cache: false,
contentType: "application/json;",
data: JSON.stringify(employee),
success: function (data) {
alert("2");
location.reload(true);
},
error: function (data) {
}
});