Question

Can someone shed some light for me on what this error means and how to go about debugging it. Firefox is not an option but I am using chrome. There are no errors on localhost, only when I uploaded to server. All versions are the same and all updates are the same. Tearing my hair out trying to know where to start. Many thanks

+++UPDATE+++
I have managed to some basic debugging in chrome and this seems to be causing the error,

Uncaught TypeError: Cannot read property 'status' of null
$.ajax.successfunctions.js:83
jQuery.extend._Deferred.deferred.resolveWithjquery-1.6.2.js:1008
donejquery-1.6.2.js:7168
jQuery.ajaxTransport.send.callback

ajax code

$(function() {

 $("#newint").submit(function() {

   var send = $(this).serialize();

    $.ajax({
      type: "POST",
      url: "newintake.php",
      cache: false,
      data: send,
      dataType: "json",
      success: function(msg) {
       if( msg.status === 'error') {
          $("#NI-result").fadeIn(1000).delay(2000).fadeOut(1000);
          $("#NI-result").removeClass('error');
          $("#NI-result").removeClass('success');
          $("#NI-result").addClass(msg.status);
          $("#NI-result").html(msg.message);
       }

       else {
          $("#NI-result").fadeIn(2000).delay(3000).fadeOut(2000);
          $("#NI-result").removeClass('error');
          $("#NI-result").addClass('success');
          $("#NI-result").addClass(msg.status);
          $("#NI-result").html(msg.message+msg.info);
          //location.reload(true);
          //$('#brtv-result').addClass("result_msg").html("You have successfully retrieved: "+data.boxnumber).show(1000).delay(4000).fadeOut(4000);
          $("#NI_slider").val(0).slider("refresh");
          $("input[type='radio']").attr("checked",false).checkboxradio("refresh");
          var myselect = $("select#NI_department");
          myselect[0].selectedIndex = 0;
          myselect.selectmenu("refresh");
          var myselect = $("select#NI_address");
          myselect[0].selectedIndex = 0;
          myselect.selectmenu("refresh");
          $("#NI_dd").val('').trigger("dorefresh");
       }

     },
      error:function(){
         $("#NI-result").show();
         $("#NI-result").removeClass('success');
         $("#NI-result").addClass('error');
         $("#NI-result").html("There was an error submitting the form. Please try again. If this continues to happen,<br />please inform the administrator of the site quoting ref#: 0001F");
     }
   });
   return false;
  });
});

Answer 1

The error you’re receiving means that the argument passed to the success callback of $.ajax, msg, is null. Therefore, when you try to access its status property, you get an error (because a null value cannot have any properties). If you put console.log(msg) in the first line of your callback this should get confirmed; you’ll just see null printed out in the console.

All of this suggests that the real problem has to do with the ajax response, rather than your Javascript handling of that response. And this goes along with what you said about how it works fine when running from your local computer. You’re experiencing some kind of server error*, and that’s precisely the thing that is changing when you run it on your local computer vs. your internet server.

*”server error” in this case does not mean that your server is making a mistake, but rather that the problem lies on the server-side rather than client (browser-JavaScript) side.

So inspect the response headers from the ajax call, as well as the server-side code that runs when the call is made. If you still can’t find the issue, update your question with the response headers & server-side code.