Я создал форму, которая динамически добавляет частичные представления, состоящие из полей формы, с помощью нажатий кнопок (для каждого частичного представления существуют уникальные кнопки - одна для запроса записи, другая для запроса ссылки).Пользователь может добавить столько исходных запросов или ссылок на исходную форму.
Извлечение HTML из частичных представлений осуществляется через Ajax JQuery.Тем не менее, это не работает последовательно.Иногда, если я открываю форму, при нажатии на одну из двух кнопок она возвращает ошибку 404.Однако, если я обновляю (или открываю в другое время), он запускает и публикует результаты без каких-либо проблем - он прекрасно работает, когда сервер может вернуть данные.Но, конечно, мне нужно, чтобы это работало согласованно, и я не могу понять, что здесь происходит.
Я попытался настроить параметры ajax - изменил тип с GET на POST и попытался найти путь, по которомучастичное представление осуществляется через помощник @ Html.UrlAction, но безрезультатно.Я гуглил это, но не вижу ничего, касающегося отключенных ошибок AJAX: частичные представления
HTML для исходной формы, вырезанные для краткости, View / Home / Index.cshtml
<div class="customer">
<form>
<div class="form-row">
<div class="form-group col-md-6">
@Html.LabelFor(x => x.FirstName, new { @class = "required" })
@Html.TextBoxFor(x => x.FirstName, new { @class = "form-control" })
@Html.ValidationMessageFor(x => x.FirstName, "", new { @class = "text-danger" })
</div>
<div class="form-group col-md-6">
@Html.LabelFor(x => x.LastName, new { @class = "required" })
@Html.TextBoxFor(x => x.LastName, new { @class = "form-control" })
@Html.ValidationMessageFor(x => x.LastName, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
@Html.LabelFor(x => x.Email, new { @class = "required" })
@Html.TextBoxFor(x => x.Email, new { @class = "form-control" })
@Html.ValidationMessageFor(x => x.Email, "", new { @class = "text-danger" })
</div>
<div class="form-group col-md-6">
@Html.LabelFor(x => x.PhNbr, new { @class = "required" })
@Html.TextBoxFor(x => x.PhNbr, new { @class = "form-control" })
@Html.ValidationMessageFor(x => x.PhNbr, "", new { @class = "text-danger" })
</div>
</div>
</form>
</div>
<div class="request">
<h2 class="topspacing-med btmspacing-med">Request Details</h2>
<button type="button" class="btn btn-outline-secondary btn-lg btn-block btmspacing-med" id="addRecord">Add New Record Request</button>
<button type="button" class="btn btn-outline-secondary btn-lg btn-block" id="addRef">Add New Reference Request</button>
<div id="displayForm"></div>
</div>
</div>
пример частичного представления - View / Partials / _RecordRequestForm.cshtml
@Html.BeginForm("SubmitRecord", "Home"){
<div id="record">
<div class="card">
<div class="card-body">
<h3>Record Request</h3>
<div class="form-group">
@Html.LabelFor(x => x.Comments)
@Html.TextAreaFor(x => x.Comments, new { @class = "form-control" })
@Html.ValidationMessageFor(x => x.Comments, "", new { @class = "text-danger" })
</div>
</div>
<div class="btn-toolbar justify-content-between" role="toolbar" aria-label="Toolbar with button groups">
<div class="btn-group float-right mt-2" role="group" aria-label="Second group" ">
<button type="button" class="btn btn-secondary btn-lg btn-block" id="cancel">Cancel</button>
<input class="btn btn-primary btn-lg btn-block" type="submit" value="Save" />
</div>
</div>
</div>
}
сценарий AJAX - в файле индекса
$("#addRecord").click(function () {
$.ajax({
//url: "../Views/Partials/_RecordRequestForm.cshtml",
url:"RenderNewRecordRequestForm",
dataType: "html",
type: 'GET',
success: function (result) {
$('#displayForm').append(result);
hideButtons();
count++;
console.log(count);
},
error: function (xhr, ajaxOptions, thrownError) {
console.log(xhr.status);
console.log(thrownError);
},
});
});
Метод действия для рендеринга частичного в контроллере дома
private string PartialViewPath(string name)
{
return $"~/Views/Partials/Home/{name}.cshtml";
}
public ActionResult RenderNewRecordRequestForm()
{
return PartialView(PartialViewPath("_RecordRequestForm"));
}
файл _Layout имеет ссылку на Jquery внизу
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
Опять же, это прекрасно работает, когда AJAX возвращает данные, но не работает согласованно.Нужно понимать, почему это иногда терпит неудачу.