javascript - REST'put','post' 400 错误请求。Javascript,HTML,Java
问题描述
我有一个填充汽车的 html 表。当我单击信息时,模式会打开汽车详细信息。从这里我想删除、创建或更新汽车。DELETE 方法有效。更新和创建没有。我用完了要改变的东西。我总是收到 400 错误请求错误。PUT,POST 在 POSTMAN 应用程序中工作。所以我认为它与我的js有关。
HTML 模态:
<!-- modal -->
<div class="modal fade" id="carModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title"><i>More Details</i></h4>
</div>
<div class="modal-body" id="contents">
<label for="pictureCar">Picture:</label>
<input type="text" id="pictureCar" ><br>
<label for="make">Make:</label>
<input type="text" id="make" ><br>
<label for="model">Model:</label>
<input type="text" id="model" ><br>
<label for="year">Year:</label>
<input type="text" id="year" ><br>
<label for="colour">Colour:</label>
<input type="text" id="colour" ><br>
<label for="reg">Reg:</label>
<input type="text" id="reg" ><br>
<label for="mileage">Mileage:</label>
<input type="text" id="mileage" ><br>
<label for="type">Type:</label>
<input type="text" id="type" ><br>
<label for="price">Price:</label>
<input type="text" id="price" ><br>
<label for="engineSize">EngineSize:</label>
<input type="text" id="engineSize" ><br>
<input type="hidden" id="carId" ><br>
</div>
<div class="modal-footer">
<button type="button" id="modalUpdate" class="btn btn-success" data-dismiss="modal">Update</button>
<button type="button" id="modalNew" class="btn btn-success" data-dismiss="modal">New</button>
<button type="button" id="modalDelete" class="btn btn-danger" data-dismiss="modal">Delete</button>
<button type="button" id="modalClose" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- end of modal -->
Javascript:
$(document).on("click", "#carModal #modalUpdate", function() {
updateCar();
})
$(document).on("click", "#carModal #modalNew", function() {
createCar();
})
var updateCar = function(){
$.ajax({
type : 'PUT',
contentType: 'application/json',
url : rootUrl+"/cars/"+$("#carId").val(),
dataType : "json",
data: carModalToJSON(),
success : function(data,textStatus,jqXHR){
findAllCars();
alert('updated car');
},
error: function(jqXHR,textStatus,errorThrown){
alert('didnt update'+textStatus);
}
});
}
var carModalToJSON=function(){
console.log("toJSON");
var id =$("#carModal #carId").val();
var make = $("#carModal #make").val();
var model= $("#carModal #model").val();
var year = $("#carModal #year").val();
var colour = $("#carModal #colour").val();
var reg= $("#carModal #reg").val();
var mil =$("#carModal #mileage").val();
var type =$("#carModal #type").val();
var price =$("#carModal #price").val();
var pic =$("#carModal #pictureCar").val();
var eng =$("#carModal #engineSize").val();
console.log("values informjson"+" "+id+" "+
make+" "+model+" "+year+" "+colour+" "+
reg+" "+mil+" "+type+" "+price+" "+pic+" "+eng);
return JSON.stringify({
"id":$("#carModal #carId").val(),
"make": $("#carModal #make").val(),
"model": $("#carModal #model").val(),
"year": $("#carModal #year").val(),
"colour": $("#carModal #colour").val(),
"reg:": $("#carModal #reg").val(),
"mileage":$("#carModal #mileage").val(),
"type":$("#carModal #type").val(),
"price":$("#carModal #price").val(),
"picture":$("#carModal #pictureCar").val(),
"engineSize":$("#carModal #engineSize").val(),
});
}
解决方案
ssc-hrep3,谢谢!在网络选项卡中显示我不能忽略注册。carToModalJSON reg 有额外的:.. 解决了这个问题。
推荐阅读
- list - 字典中的 Ansible 解析列表
- bash - 没有文件扩展名的 Bash 或 tsch 命令
- react-native - 有没有一种好方法可以设置 headerRight 以在 React Native 中传递 onPress 事件
- ios - 从 SwiftUI 按钮从另一个 swift 文件调用函数不听从函数返回
- javascript - 如何使用 axios 捕获 http json 响应并将值传递给另一个函数?
- verilog - SystemVerilog 连接分配不正确
- c++ - Bazel 链接器未找到函数定义
- appium - 如何让 Webdriverio 与 appium-desktop 检查器一起使用?
- webstorm - 如何在 WebStorm 控制台中禁用换行?
- asp.net-core - NavigationManager.Uri 根本不会更新,除非页面被刷新。如何在 Blazor Server 中获取真实的当前 URI?