[英]Spring boot, Mongodb, jquery ajax and java
I had sample application which enables the user to search a customer with it and shows all the customers from the Mongodb (and it works well), so i tried to upgrade the application so that the user can add, update and delete a customer with an id. 我有一个示例应用程序,该应用程序使用户可以使用它搜索客户并显示Mongodb中的所有客户(并且效果很好),因此我尝试升级该应用程序,以便用户可以使用以下方式添加,更新和删除客户: ID。
I tried several ways to add and delete a new customer. 我尝试了几种添加和删除新客户的方法。 However, it does react for that.
但是,它确实对此做出了反应。 How to fix that My FULL CODE
如何修复我的完整代码
My html page 我的html页面
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<input name="search" type="text" maxlength="100" id="search"/>
<button onclick="searchID()"> Search ID </button>
<button onclick="showAll()"> Show All </button>
<div id="persons"></div>
<script>
function searchID()
{
var id = document.getElementById("search").value;
$("#persons").html("");
$.getJSON("http://localhost:8080/customers/" + id, function(data)
{
for (var i in data) {
$('#persons').append("<p>ID: " + data[i].id + "</p>")
$('#persons').append("<p>First name: " + data[i].firstName + "</p>")
$('#persons').append("<p>Last name: " + data[i].lastName + "</p><br>")
}
});
}
function showAll()
{
$("#persons").html("");
$.getJSON("http://localhost:8080/customers/", function(data)
{
for (var i in data) {
$('#persons').append("<p>ID: " + data[i].id + "</p>")
$('#persons').append("<p>First name: " + data[i].firstName + "</p>")
$('#persons').append("<p>Last name: " + data[i].lastName + "</p><br>")
}
});
}
</script>
<h2>Add Customer</h2>
<form action="http://localhost:8080/customers" method="POST">
ID <input type="text" id="id" name="id" /><br />
FirstName <input type="text" id="firstName" name="firstName" /><br />
LastName <input type="text" id="lastName" name="lastName" /><br />
<input type="submit" />
</form>
<h3>Update a customer</h3>
<form action="http://localhost:8080/updateCustomer" method="POST">
ID <input type="text" id="id" name="id" /><br />
FirstName <input type="text" id="firstName" name="firstName" /><br />
LastName <input type="text" id="lastName" name="lastName" /><br />
<input type="submit" />
</form>
<h4>Delete a customer</h4>
<form action="http://localhost:8080/deleteCustomer" method="POST">
ID <input type="text" id="id" name="id" /><br />
<input type="submit" />
</form>
</body>
</html>
Apart of my CustomerRestController class: 除了我的CustomerRestController类:
@RestController
public class CustomerRestController
{
@Autowired
CustomerMongoRepository customerRepository;
@Autowired
private CustomerDAO customerDAO;
@CrossOrigin
@GetMapping("/customers")
public ArrayList<Customer> getCustomers()
{
customerDAO = new CustomerDAO();
return customerDAO.getCustomers();
}
@CrossOrigin
@GetMapping("/customers/{id}")
public ArrayList<Customer> getCustomer(@PathVariable("id") int id)
{
customerDAO = new CustomerDAO();
return customerDAO.get(id);
}
@RequestMapping(method = POST)
@ResponseStatus(CREATED)
public void createCustomer(@RequestBody Customer customer,
HttpServletResponse response) {
customerDAO.save(customer);
response.setHeader("Location", String.format("/rest/customers/%s",
customer.get(id)));
}
@RequestMapping(value = "/{id}", method = GET)
@ResponseBody
public Customer showCustomer(@PathVariable Customer.id id) {
return customerDAO.findBy(id);
}
@RequestMapping(value = "/{id}", method = PUT)
@ResponseStatus(OK)
public void updateCustomer(@RequestBody Customer customer) {
customerDAO.save(customer);
}
@RequestMapping(value = "/{id}", method = DELETE)
@ResponseStatus(OK)
public void deleteCustomer(@PathVariable Customer.id id) {
customerDAO.delete(id);
}
}
It seems you don't have a controller method to handle the view request: 似乎您没有控制器方法来处理视图请求:
@RequestMapping(value = "/{id}", method = DELETE)
@ResponseStatus(OK)
public void deleteCustomer(@PathVariable Customer.id id) {
customerDAO.delete(id);
}
You are expecting DELETE /uid
but your view sends POST /deleteCustomer
: 您期望
DELETE /uid
但是您的视图发送POST /deleteCustomer
:
<h4>Delete a customer</h4>
<form action="http://localhost:8080/deleteCustomer" method="POST">
ID <input type="text" id="id" name="id" /><br />
<input type="submit" />
</form>
Change your controller to: 将您的控制器更改为:
@RequestMapping(value = "/deleteCustomer", method = POST)
@ResponseStatus(OK)
public void deleteCustomer(@RequestParam String id) {
customerDAO.delete(id);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.