Reputation: 356
I have a form in my partial view, which submit by making ajax call. But the problem is the form submit multiple tomes. And I found out the reason which is very weird and I don;t know how to resolve it.
In main view,
@Html.Partial("_Jobs", Model.UserJobs)
@section Scripts {
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/jqueryval")
}
I my partial view I have a form
<script>
function onSuccess() {
$.fancybox.close();
console.log("success");
return false;
}
function onFailure() {
alert("fail");
}
</script>
@using (Ajax.BeginForm("CreateJob", "Jobs", null,
new AjaxOptions()
{
HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
OnSuccess = "onSuccess",
OnFailure = "onFailure",
UpdateTargetId = "userJobsList"
}, null))
{
@Html.ValidationSummary()
<div class="col-right">
@Html.DropDownListFor(model => model.SelectedProjectId, Model.ProjectList, "Select an Option", new { @class = "text-box", id = "projects" })
@Html.TextBoxFor(model => model.Title, new { @class = "text-box", placeholder = "Job Title" })
<br />
@Html.TextAreaFor(model => model.Description, new { @class = "text-box", placeholder = "Description" })
<div class="col-right-1">
<button id="createButton">
Create
</button>
<button id="cancelButton">
Cancel
</button>
</div>
</div>
</div>
}
By giving the reference of 'jqueryval' in main view not validate the form in partial view but the form is submit in normal way (i.e single time)
In order to validate the form I then remove the reference 'jquery val from main view and put inside partial view after the form, by making these little change form start validating before submit but when after all the validation pass the form submit multiple times. Any body can help me to figured out why it submits multiple time.? What is the best place to put 'jqueryval' as a reference?
Upvotes: 2
Views: 1863
Reputation: 81
You might have multiple references to jquery.unobtrusive-ajax.js in your page. View the page source and make sure you have a single reference to this library.
Upvotes: 6