Quantcast
Channel: ASP.NET AJAX + Ajax Control Toolkit (ACT)
Viewing all articles
Browse latest Browse all 5678

Ajax call not returning success or failure when Controller completes

$
0
0

I am trying to show a Bootstrap Modal popup while performing a save function in my MVC controller. I can debug through the controller and the popup displays. However when the controller returns, the success or failure call in the ajax function is never hit. Can anyone help?

I have a Controller function set like this:

public class MyTestController : Controller

{

[HttpPost]
public IActionResult MySave(MyViewModel model)
{
   if (ModelState.IsValid)
    {
       return RedirectToAction("Index", "Tools");
   }
   return RedirectToAction("Index", model);
}

}

In my .cshtml page, I have  set my form up like this:

@model MyViewModel

using (Html.BeginForm("MySave", "MyTest", FormMethod.Post,
                          new { encType = "multipart/form-data", id = "newToolForm", name = "newToolForm" }))
{

    <form id="newToolForm" method="post" asp-action="">

        @Html.Partial("DetailsView", Model)

        <hr />

        <div class="form-group">
            <div class="col-md-offset-5 col-md-1">
                <input type="submit" value="Save" class="btn" id="save" />
            </div>
        </div>

        <div id="busyModal" class="modal fade" role="dialog" data-backdrop="static" data-keyboard="false">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 id="busymodaltitle" class="modal-title" />
                    </div>
                    <div class="modal-body">
                        <p id="busymodalbody" />
                    </div>
                </div>
            </div>
        </div>

    </form>
}

In my scripts section I have the following ajax call:

@section Scripts

    {
    @{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
 
    <script type="text/javascript">

        $(document).ready(function () {

            //// Attach click handler to the submit button:
            //$('#save').click(function () {
            //    $('#newToolForm').submit();
            //});

            // Handle the form submit event, and make the Ajax request:
            $("#newToolForm").on("submit", function (event) {
                event.preventDefault();

                $("#busyModal").modal('toggle');

                var url = $(this).attr("action");
                var formData = $(this).serialize();
                $.ajax({
                    url: url,
                    type: "POST",
                    data: JSON.stringify(formData),
                    dataType: "json",
                    processData: false,
                    success: function (resp) {
                        $('#busyModal').modal('toggle');
                    },
                    failure: function (resp) {
                        $('#busyModal').modal('toggle');
                    }
                })
            });
        });

    </script>

}


Viewing all articles
Browse latest Browse all 5678

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>