Angular + Spring MVC. Собираю данные из формы с ангуляра
<form ng-submit="updateSalary()" enctype="multipart/form-data">
<div class = "container row">
<h1>Edit salary</h1>
<div class="col-md-4">
<img ng-src="/image?id={{salary.data.id}}" width="366px" height="488px"/>
</div>
<div class="col-md-8">
<table class = "table table-hover">
<tr>
<td> Team Name: </td>
<td><input type="text" required="string" ng-model="salary.data.team_name"></td>
</tr>
<tr>
<td>Player Name: </td>
<td><input type="text" required="string" ng-model="salary.data.player_name" disabled="disabled"></td>
</tr>
<tr>
<td>Salary: </td>
<td><input type="number" required="string" ng-model="salary.data.salary"></td>
</tr>
<tr>
<td>Position: </td>
<td><input type="text" required="string" ng-model="salary.data.position"></td>
</tr>
<tr>
<td>Sex: </td>
<td><input type="text" required="string" ng-model="salary.data.sex" disabled="disabled"></td>
</tr>
<tr>
<td>Living Place: </td>
<td><input type="text" required="string" ng-model="salary.data.living_place"></td>
</tr>
<tr>
<td>Load new foto: </td>
<td><input type="file" file-model="myFile"></td>
</tr>
<tr>
<td><button class="btn btn-primary">Edit</button></td>
<td> </td>
</tr>
<tr>
<td>
<a class="btn btn-primary" href="#/" role="button">Cancel</a>
</td>
<td> </td>
</tr>
</table>
</div>
</form>
И при отправке получаю, что
"The request sent by the client was syntactically incorrect."
Мои контроллеры:
Salary.service('fileUpload', ['$http', '$location', function ($http, $location) {
this.uploadFileToUrl = function(data, uploadUrl){
$http.post(uploadUrl, data, {
transformRequest: angular.identity,
headers: {'Content-Type' : undefined}
})
.success(function(){
$location.path("/");
})
.error(function(){
alert('Загрузка не прошла!');
});
}
}]);
Salary.directive('fileModel', ['$parse', function ($parse) {
return {
restrict: 'A',
link: function(scope, element, attrs) {
var model = $parse(attrs.fileModel);
var modelSetter = model.assign;
element.bind('change', function(){
scope.$apply(function(){
modelSetter(scope, element[0].files[0]);
});
});
}
};
}]);
Salary.controller("editSalaryController", [ '$scope', '$http', 'salary', '$location', 'fileUpload',
function($scope, $http, salary, $location, fileUpload){
$scope.salary = salary;
var dataForm = new FormData();
dataForm.append('id', $scope.salary.data.id);
dataForm.append('team_name', $scope.salary.data.team_name);
dataForm.append('player_name', $scope.salary.data.player_name);
dataForm.append('salary', $scope.salary.data.salary);
dataForm.append('position', $scope.salary.data.position);
dataForm.append('sex', $scope.salary.data.sex);
dataForm.append('living_place', $scope.salary.data.living_place);
dataForm.append('image', $scope.myFile);
var url = "/editSalary"
$scope.updateSalary = function() {
fileUpload.uploadFileToUrl(dataForm, url);
}}]);
@RequestMapping(value = "/editSalary", method = RequestMethod.POST, consumes = "multipart/form-data")
@ResponseBody
public Salary editSalary(@RequestBody FileUpload dataForm){
Salary salary = new Salary();
try{
salary.setId(dataForm.getId());
salary.setTeam_name(dataForm.getTeam_name());
salary.setPlayer_name(dataForm.getPlayer_name());
salary.setSalary(dataForm.getSalary());
salary.setPosition(dataForm.getPosition());
salary.setSex(dataForm.getSex());
salary.setLiving_place(dataForm.getLiving_place());
salary.setImage(dataForm.getImage().getBytes());
}
catch (Exception e){
System.out.println(e);
}
this.salaryService.updateToDB(salary);
return null;
}