Share via

Ajax modal validation - 500 internal server error

Question

Thursday, January 9, 2020 10:32 PM

I’m not really sure why this isnt working, I have the exact same thing in a different part of the project, Im getting a “POST” 500 (Internal Server Error) I’m simply just trying to get @using (Ajax.BeginForm( Validation to work on a modal. Like I said I have this exact thing working on a different part of the project and it works. My modal populates successfully but when I click the submit button I get the error above. In my view both the modal and controls of the modal I have HtmlHelper.UnobtrusiveJavaScriptEnabled = true;

 I have all of these libraries In my code.

<script src="/Scripts/jquery-3.3.1.js"></script>
<script src="/Scripts/jquery-ui-1.12.1.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>

@using (Ajax.BeginForm("PartNumberUpdate", "Parts", new AjaxOptions() { HttpMethod = "POST", UpdateTargetId = "PartNumControls", OnSuccess = "ajaxPartUpdate" }))
{
    <div class="modal" id="modalPNUpdate" tabindex="-1" role="dialog" aria-labelledby="lblPNUpdate" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Part Number Details</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body" id="PartNumControls">
                    @Html.Partial("PNControls")
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                    <input type="submit" class="btn btn-primary" value="Save" />
                </div>
            </div>
        </div>
    </div>
}
        [HttpPost]
        [ValidateAntiForgeryToken]
        [HandleError]
        public ActionResult PartNumberUpdate(FindPartModel model)
        {
            if (ModelState.IsValid)
            {
                var partNumber = context.PartNumbers.Where(x => x.PartNumber1 == model.PartVM.PartNumber).FirstOrDefault();
                partNumber.PartNumber1 = model.PartVM.PartNumber;
                
                /// UPDATE PartNumber Record
                context.Entry(partNumber).State = EntityState.Modified;
                context.SaveChanges();
                string returnStr = "refresh";
                ModelState.Clear();
                return Json(returnStr);
            }
            return PartialView("PNControls", model);
        }

        public ActionResult PNControls()
        {
            return View(new FindPartModel());
        }

All replies (5)

Thursday, January 9, 2020 11:14 PM ✅Answered

The form is missing the anti-forgery token.  When asking for community debugging assistance always share all the relevant code.   In this case we need the Partial View and the model definition.

Friday, January 10, 2020 4:05 PM ✅Answered

I found my error.

It was custom validation on my model. Was using the other model.

Thank you@! I ended up figuring it out by using the network tab and in 'All' looking through the stacktrace figuring out a more detailed error.

Friday, January 10, 2020 5:44 AM

Hi ExceedingLife,

Im getting a “POST” 500 (Internal Server Error)

A 500 error is not enough for you to see the reason why it failed. Press F12 to open your browser devtool, in the "Network", click the name which should be red and you can see the real reason for this error in the "Preview" at right:

As you can see, the true error should be "The required anti-forgery form field "__RequestVerificationToken" is not present.", for this error, you can refer to The required anti-forgery form field “__RequestVerificationToken” is not present Error in user Registration.

In the above thread, put a @Html.AntiForgeryToken() in your form should solve the problem.

Best Regard,

Yang Shen

Friday, January 10, 2020 2:52 PM

I have the antiforgerytoken in the view already..

Here is the partial with all the controls

@model Messer_PartNumbers.Models.FindPartModel
@{ 
    HtmlHelper.UnobtrusiveJavaScriptEnabled = true;
}

@Html.AntiForgeryToken()

<span class="alert-danger">
    @Html.ValidationSummary(true, "", new { @class="text-danger" })
</span>

@Html.HiddenFor(x => x.PartVM.PartID)
@Html.HiddenFor(x => x.PartVM.PartGroup)
@Html.HiddenFor(x => x.PartVM.GlobalPart)
@Html.HiddenFor(x => x.PartVM.Released)

<div class="form-group">
    @Html.LabelFor(x =>x.PartVM.PartNumber, htmlAttributes: new { @class="control-label col-3" })
    <div class="col-9">
        @Html.TextBoxFor(x => x.PartVM.PartNumber, new { @class="form-control", @readonly="readonly" })
        @Html.ValidationMessageFor(x => x.PartVM.PartNumber, "", new { @class="text-danger" })
    </div>
</div>
<div class="form-group">
    @Html.LabelFor(x => x.PartVM.EnteredBy, htmlAttributes: new { @class = "control-label col-3" })
    <div class="col-9">
        @*@Html.TextBoxFor(x => x.PartVM.EnteredBy, new { @class="form-control" })*@
        @Html.DropDownListFor(x=>x.PartVM.EnteredBy, Model.PNEnteredByOptions, new { @class="form-control"})
        @Html.ValidationMessageFor(x => x.PartVM.EnteredBy, "", new { @class = "text-danger" })
    </div>
</div>
<div class="form-group">
    @Html.LabelFor(x => x.PartVM.DateEntered, htmlAttributes: new { @class = "control-label col-3" })
    <div class="col-9">
        @Html.TextBoxFor(x => x.PartVM.DateEntered, new { @class = "form-control", @readonly = "readonly" })
        @Html.ValidationMessageFor(x => x.PartVM.DateEntered, "", new { @class = "text-danger" })
    </div>
</div>
<div class="form-group">
    @Html.LabelFor(x => x.PartVM.MachineTypes, htmlAttributes: new { @class = "control-label col-3" })
    <small>Hold Ctrl to select multiples</small>
    <div class="col-9">
        @*@Html.TextBoxFor(x => x.PartVM.MachineTypes, new { @class = "form-control" })*@
        @Html.ListBoxFor(x => x.PartVM.MachineTypes, Model.PNMachineTypeOptions, new { @class = "form-control", @size = 5, @style = "overflow:scroll;" })
        @Html.ValidationMessageFor(x => x.PartVM.MachineTypes, "", new { @class = "text-danger" })
    </div>
</div>

<div class="form-group">
    @Html.LabelFor(x => x.PartVM.Description, htmlAttributes: new { @class="control-label col-3" })
    <div class="col-9">
        @Html.TextBoxFor(x => x.PartVM.Description, new { @class="form-control" })
        @Html.ValidationMessageFor(x => x.PartVM.Description, "", new { @class="text-danger" })
    </div>
</div>

Friday, January 10, 2020 3:07 PM

I have the antiforgerytoken in the view already..

The community can only see the code you share on the forum.

A 500 error is thrown when the sever is unable to recover.  The source of the error can be a bad request or a code bug.  At this point you have not provided enough source code for the community to debug your code.  

Take Yang Shen's advice and use the browser's dev tools to review the server response from the AJAX request.  Often the response contains the error which will highlight the problem.

  • Last updated on