Question

I want to be able to show a loading div when making ajax requests, so I am trying to change my requests from $.get to $.ajax so I can use the beforeSubmit and complete actions.

For some reason, the get below works, but the ajax does not. Any thoughts as to why? The method is triggered, but in fiddler I can see no request goes back to the server.

WORKS:

$("#testBoundChart").click(function (e) {
                        $.get('/charter/bound', callbackFn);
                        function callbackFn(data) {
                            //Append markup to dom
                            $('body').append(data);
                            // call the js function from the partialview here 
                            generateChart();
                        }
                    });

NO REQUEST SENT:

            $("#testBoundChart").click(function (e) {
            alert("triggered");
            $.ajax({
                    url: '/charter/bound',
                    data: data,
                    success: (function(data) {
                        //Append markup to dom
                        alert("success");
                        $('body').append(data);
                        // call the js function from the partialview here 
                        generateChart();
                    }),
                    error: (function () {
                    alert("error");
                })
            });
        });

Many thanks

Answer 1

It looks like you are missing a semicolon for the error function. Though I’m not sure why it isn’t giving a Javascript error.