Ajax Action Link Call Back Fails to Fire

Question

I have a .cshtml Razor view with the following div

<div id="software_updates" class="htmlCode tab-pane fade">
    @using (Html.BeginForm(new { @class = "form-horizontal", role = "form" }))
    {
        @Html.AntiForgeryToken()
            <div id="update_text_content" class="active fade in">
                <h2>Software Update Notification Service</h2>
                <h4>
                    This function will send all registered users 
                    a notification of a revision/update to the existing software. The message
                    they receive will be the following:
                </h4>
                @{
                    var updateMessage =
                        String.IsNullOrEmpty(Model.ExampleUpdateMessage) ?
                            String.Empty :
                            Model.ExampleUpdateMessage;
                }
                <pre>@updateMessage</pre>
                @Ajax.ActionLink(
                "Send Update Notification",
                "SendUpdateNotifications",
                "Tools",
                null,
                new AjaxOptions 
                { HttpMethod = "GET", OnSuccess = "onSuccess" },
                new
                {
                    onclick = String.Format(
                        "return confirm('Are you sure you want to send a " +
                        "revision notification to the {0:N0} registered {1}?');",
                        @Model.UserList.Count,
                        "user".Pluralize(@Model.UserList.Count)),
                    @class = "btn btn-lg btn-danger",
                    role = "button",
                    onSuccess = "onCompletion"
                })
                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <span id="notify_failure_message" class="label label-danger"></span>
                        <span id="notify_success_message" class="label label-success"></span>
                    </div>
                </div>
            </div>
    }
</div>

I then have in my controller some C# code that returns an ActionResult/JsonResult

[AllowAnonymous]
public async Task<JsonResult> SendUpdateNotifications()
{
    string result = String.Empty;
    try
    {
        ... // Some stuff.
        return Json(new
        {
            notify_success = result.ConvertToHtmlString(),
            notify_failure = String.Empty
        }, JsonRequestBehavior.AllowGet);
    }
    catch (Exception e)
    {
        result = String.Format(
            "DrGroup Revision/Update notifications failed to send\n" + 
            "See the invite Log for more information.\n" + 
            "Error: {0}", 
            e.Message);
        return Json(new
        {
            notify_success = String.Empty,
            notify_failure = result.ConvertToHtmlString()
        }, JsonRequestBehavior.AllowGet);
    }
}

and I have the following javascript function to update the text in my <span id="notify_failure_message" ....

@section scripts {
    <script>
        function onSuccess(result) {
            $('#notify_failure_message').html(result.notify_failure);
            $('#notify_success_message').html(result.notify_success);
        }
    </script>
}

When I click my button my Method fires and it returns the Json object

return Json(new
{
    notify_success = result.ConvertToHtmlString(),
    notify_failure = String.Empty
}, JsonRequestBehavior.AllowGet);

However, it seems my java script function onSuccess is never being used and I want to know why. What am I doing wrong and how can I fix it?

Thanks for your time.

Doesn't `onSuccess` belong in `AjaxOptions` rather than with the HtmlAttributes? — Jasen, Aug 11 '15 at 20:12
OMG. It has been a long long day... Thanks very much for your time. — MoonKnight, Aug 11 '15 at 20:31
Although this was a massive step in the right direction, I still am not getting my ``s to update? — MoonKnight, Aug 11 '15 at 22:38

score 0 · Answer 1 · edited May 23 '17 at 10:28

Finally got this working...

I needed to install jQuery unobtrusive ajax via NuGet. I did this using the following Package Manager command

PM> Install-Package Microsoft.jQuery.Unobtrusive.Ajax

I hope this save someone else some time.

Note, however this stops other Ajax notification code from working. See https://stackoverflow.com/questions/31961761/install-package-microsoft-jquery-unobtrusive-ajax-stopped-download-dialog-popup

Ajax Action Link Call Back Fails to Fire

1 Answers1