У меня есть форма Thymeleaf в Bootstrap Модал, и я хочу обработать ее вызовом jQuery - Ajax. Форма выглядит следующим образом:
<form th:action="@{/model/new}" th:method="POST" th:object="${modelForm}" id="form-new-model">
<div class="form-group">
<label for="name"><strong>Model name</strong></label>
<input type="text" class="form-control" th:classappend="${#fields.hasErrors('name')} ? is-invalid : '' " th:field="*{name}" aria-describedby="name" placeholder="My awesome model">
<div class="invalid-feedback" th:if="${#fields.hasErrors('name')}" th:errors="*{name}">Error name</div>
</div>
<div class="form-group">
<label for="description"><strong>Model description (optional)</strong></label>
<textarea class="form-control" th:field="*{description}" rows="3" placeholder="Description"></textarea>
</div>
<div class="form-group row border-top align-items-center mb-0">
<div class="col text-right mt-2">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Add</button>
</div>
</div>
</form>
В контроллере у меня есть следующее:
@PostMapping("/model/new")
public String newModel(@Valid modelForm modelForm, BindingResult bindingResult, RedirectAttributes attributes) {
if(bindingResult.hasErrors()){
attributes.addFlashAttribute("org.springframework.validation.BindingResult.dexModelForm", bindingResult);
attributes.addFlashAttribute("modelForm", modelForm);
return "project/modal-new-model";
}
// creating the object since it is valid
// and returning success response with the new updated view
return "";
}
Так как я обрабатываю форму с jQuery, у меня есть:
$(document).on('submit', '#form-new-model', function(e){
e.preventDefault();
const csrf = $(this).find('input[name="_csrf"]').val();
$.ajax({
type: 'POST',
url: '/model/new',
headers: {'csrf-token':csrf},
data: $(this).serializeArray(),
cache: false,
success: function(data){
// Here the controller needs to bring me a Success Response (No error).
// And then I refresh specific parts of the whole view.
},
error: function(data){
// I need first to bring 'SOMETHING' from the controller that says is an error.
// Here I have to update the form since I will return a view from the controller.
}
});
});
Итак, теперь вопрос в том, как я могу контролировать с контроллера, какой он ответ, и отправлять вместе с ответом конкретное c представление HTML / Thymeleaf?