首页 > 解决方案 > 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(),


});

}

模态快照

chrome中控制台的快照

标签: javascripthtmlrestpostman

解决方案


ssc-hrep3,谢谢!在网络选项卡中显示我不能忽略注册。carToModalJSON reg 有额外的:.. 解决了这个问题。


推荐阅读