Ajax success not running

Question

So im having a weird issue. I made a small application on my machine that works fine but when I upload to a school server it stops working. What I am doing is accessing json data with ajax. I have tested and I am getting the correct json responses, I am connecting to the database just fine and the ajax is running every two seconds as it should. But the code in the success section of the ajax never runs. The database on the server is identical to the one on my machine, the connection has been troubleshooted and works great but still the ajax success code doesn't run. Thanks in advance!

setInterval(function () {
            $.ajax({
                type: 'GET',
                url: 'JSONFile.php',
                dataType: 'json',
                success: function (retrieved) {
                    $.each(retrieved, function (index, i) {
                         alert('This line of code is the problem. This alert does not run but should');
                    });
                }
            });
        }, 2000);

put up an error call back and see if that get's fired instead :-) — Randy Casburn, Dec 09 '18 at 03:08
Is the JSONFile.php file hosted on same web server (same host, port etc) ? — Sumer, Dec 09 '18 at 03:12
added an error call and it broke more, JSONFile.php is on the server and is giving a response and I have no errors in the console — Joel Schmidt, Dec 09 '18 at 03:17
Putting an alert in a callback in a set interval is a terrible idea, use console.log instead — Musa, Dec 09 '18 at 04:02
Have you tried looking through devtools network panel? does it show the request and response? — Vinay, Dec 09 '18 at 04:06
**success** has been removed from jQuery 3.3.1 - no matter what you do, it won't get called. You need to read the documentation carefully. — user2182349, Dec 09 '18 at 04:34
Switched versions of jquery to have it supported. Also looking at the devtools and not getting any errors. It is showing good responses — Joel Schmidt, Dec 09 '18 at 04:36
If this is a new project, I suggest you take a little time to learn to work with jQuery 3+. It is a good idea to use the most current versions of tools. — user2182349, Dec 09 '18 at 05:22

Attila Antal · Answer 1 · 2018-12-09T05:02:13.460

0

If not yet done, please ensure that the PHP file returns a JSON response from the server. AJAX is set to communicate with the server using JSON format, and if the server does not responsd that way, AJAX will not conside the response as success.

Check out the Returning JSON from PHP to JavaScript?.

Update:

Try to run the following code while having the Developer Tools of the browser open. Once the app stops at the breakpoint, check the data in the browser and see what you've got. It is most likely a string in JSON format, that means you will need to parse it to be able to iterate through it's items.

success: function(data){
    debugger; // inspect the returned data
    var obj = JSON.parse(data); // returned data is a string and so, to work on it, it needs to be parsed
    $.each(obj, function (index, i) {
        $('<div class="Post"><h2>' + i.UserName + '</h2><p>' + i.Content + '</p></div>').prependTo($('#MainContent')).fadeOut(1).fadeIn(1000); }
    );
}

edited Dec 09 '18 at 05:02

answered Dec 09 '18 at 04:08

Attila Antal

811
8
17

In the following code I have now gotten the first alert to run but not the second – Joel Schmidt Dec 09 '18 at 04:38
success: function(data){ alert("hi"); $.each(data, function (index, i) { //prepend with a fade in animation alert('Hi'); $('
' + i.UserName + '
' + i.Content + '
').prependTo($('#MainContent')).fadeOut(1).fadeIn(1000); }); } – Joel Schmidt Dec 09 '18 at 04:39
Correction: commenting out datatype: 'json', allows the inside to run but then .each wont work – Joel Schmidt Dec 09 '18 at 04:47
try to place a debugger right before the $.each() method and check the data yourself in the browser. You will then understand what type of data is received, and based on that make your next move. – Attila Antal Dec 09 '18 at 04:59
I've updated my answer with some suggestions that you can try. – Attila Antal Dec 09 '18 at 05:03

score -1 · Answer 2 · answered Dec 09 '18 at 03:54

jQuery 3 is coded using done, fail and always

// Assign handlers immediately after making the request,
// and remember the jqXHR object for this request
var jqxhr = $.ajax( "example.php" )
  .done(function() {
    alert( "success" );
  })
  .fail(function() {
    alert( "error" );
  })
  .always(function() {
    alert( "complete" );
  });

https://api.jquery.com/jQuery.ajax/

Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callbacks are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.

Ajax success not running

2 Answers2

' + i.UserName + '