Я хочу Post форму, используя Ajax/XMLHttpRequest до ASP NET Core Controller.
Если я просто Post форма, она получает данные прямо в Controller, но при использовании XMLHttpRequest полейиз моих model получить значения по умолчанию:
Я включил в свой код следующие 2 формы: одну форму, которая просто Posts до url, указанную в атрибуте action, и другую, котораявызывает method и Post -с с XMLHttpRequest.
HTML + JS
<!DOCTYPE html>
<html>
<head>
<script>
window.submit = function () {
var form = document.getElementById("delegate-form");
var data = new FormData(form);
var xhr = new XMLHttpRequest();
var content=form.getAttribute('Content-Type');
var method=form.getAttribute('method');
var action=form.getAttribute('action');
xhr.open(method,action);
xhr.setRequestHeader('Content-Type',content);
xhr.onload = function () {
if (xhr.status == 200) {
resolve(xhr.response);
}
else if (xhr.status != 200) {
reject("Failed to submit form with status" + xhr.status);
}
}
xhr.send(data);
};
</script>
</head>
<body>
<div id="Form-without-ajax">
<form method="POST" enctype="multipart/form-data" action="http://localhost:8300/api/bulk">
<input type="text" name="Name" value="aa" />
<input type="text" name="ID" value="13"/>
<input type="file">
<br>
<input style="align-content: flex-end" type="submit" />
</form>
</div>
<br>
<div id="Form-with-ajax">
<form method="POST" id="delegate-form" enctype="multipart/form-data" action="http://localhost:8300/api/bulk">
<input type="text" name="Name" value="ab" />
<input type="text" name="ID" value="33"/>
<input type="file">
<br>
</form>
<button onclick="submit()">Submit with delegate</button>
</div>
</body>
</html>
Модель
[Serializable]
public class Data {
public string Name { get; set; }
public int ID { get; set; }
}
}
.NET Controller
[HttpPost]
[Route("/api/bulk")]
public async Task TestBulkAsync(Data data) {
//data has Name=null and id=0 when using the XMLHttpRequest
}
PS Я использую multipart/form-data, потому что я хочу прикрепить некоторые файлы, помимо этой модели. Имне нужен обработчик, как в моем случае submit, потому что мне нужно выполнить дополнительную логику перед отправкой формы.