Javascript Ajax Callback function not defined error

Question

I tried searching all around since this seems to me a very common (NuBee?) problem, but nothing worked for me...so here it is

To cut right to the chase, my Razor code (shown later) posts an ajax form to a MVC4 action which works fine but any attempt to add a callback function to the form (OnSuccess, OnBegin etc) fails with a runtime error that the callback function is not defined. This is the image of the error message in the my Chrome browser, right after the exception occurs:

JSChromeError

This is the form's code:

    @using (Ajax.BeginForm("AskQuestion", null, 
        new AjaxOptions() { 
            OnSuccess = "endAskQuestion" },
        new { id = "askQuestionForm" }))
    {
        @Html.AntiForgeryToken() 
        @Html.ValidationSummary(true)

        <fieldset>
            <legend>@ViewBag.Controller</legend>
            <br />
            @{ var investigationID = Model.Investigation.InvestigationID; }
            @Html.HiddenFor(model => investigationID)
            <input type="submit" class="button" value="שלח היגד"/>
            <input type="button" id="cancelEdit" class="button" value="בטל עריכה"/>
        </fieldset>
    }

And the script inside which the endAskQuestion is defined:

$(document).ready(function () {

    //deleted several Jquery and JS functions...

    // callback function definition
    function endAskQuestion() {
        alert("adad");
    }
})

Also, I saw some posts that stated the references to JQuery and Ajax scripts are important so here's the html's head section with the references:

<head>
    <meta charset="utf-8" />
    <title>RTInvestigation</title>
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <link href="/Content/css?v=_WuF_JGHabtqdWNcwICWILVG9A391eZyF0GO24jlq9U1" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" />
    <script> </script>
    <meta name="viewport" content="width=device-width" />
    <script src="/Scripts/jquery-1.8.2.js"></script>

    <script src="/Scripts/jquery-ui-1.8.18.js"></script>
    <script src="/Scripts/jquery-ui-1.8.20.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>

</head>

I don't know why Razor creates references for two Jquery-UI versions...I couldn't find the reason.

How come the callback function is not defined??

Thanks for helping

You're code is producing some form of IIFE and it doesn't define your function endAskQuestion. — Henrik Andersson
– Henrik Andersson, Commented Oct 21, 2013 at 7:26

ps2goat · Accepted Answer · 2013-10-21 07:26:48Z

2

Take endAskQuestion out of the $(document).ready function. Also, use a semicolon at the end of each javascript code line, as that will often throw undefined errors, as well.

$(document).ready(function () {

    //deleted several Jquery and JS functions...

}); // added semicolon here...

// callback function definition should be moved outside
function endAskQuestion() {
    alert("adad");
}

answered Oct 21, 2013 at 7:26

ps2goat

8,5251 gold badge39 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Max Koretskyi · Accepted Answer · 2013-10-21 07:31:48Z

0

The scope of your endAskQuestion is limited to the anonymous function that jQuery calls when the document is ready. As ps2goat says, you need to take it out of the $(document).ready callback. In this way it will be defined globally and will be accesible through closure to the callbakc you're using for AJAX. Read about scoping, closures and anonymou.

answered Oct 21, 2013 at 7:31

Max Koretskyi

106k69 gold badges356 silver badges524 bronze badges

1 Comment

user1707621 Over a year ago

Had a feeling the function's scope was the issue, should really read about scoping in JS scripts. Tnx

Collectives™ on Stack Overflow

Javascript Ajax Callback function not defined error

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related