Uncaught TypeError: Cannot read property 'message' of undefined

Question

I am trying to implement an AJAX contact form for my site, the problem I am encountering is that when I click on submit I get the following error in Google Chrome:

"Uncaught TypeError: Cannot read property 'message' of undefined----contact-form.js:38".

Please find the HTML code and contact-from.js.

You should tag this with JavaScript, Chrome, AJAX, etc. so the right people see it. — Emmet, Mar 10 '14 at 20:58
Check the 'response.responseJSON' value if it's not null/undefined before accessing it: if(response.responseJSON) .... — Kaz-LA, Mar 10 '14 at 21:07

score 1 · Accepted Answer · edited May 23 '17 at 11:44

1

The error is because responseJSON isn't a standard property or one that jQuery makes available for XMLHttpRequests.

You'll want to use responseText instead, which may be parsable:

contactForm.addAjaxMessage($.parseJSON(response.responseText).message, true);

// or
contactForm.addAjaxMessage(response.responseText, true);

edited May 23 '17 at 11:44

Community

1
1

answered Mar 10 '14 at 21:10

Jonathan Lonowski

121,453
34
200
199

score 0 · Answer 2 · answered Mar 10 '14 at 21:06

error: function(response) {
     contactForm.addAjaxMessage(response.responseJSON.message, true);
}

If you take a look at the jQuery documentation for error in $.ajax, you'll see that the third parameter to the callback function is a string containing the error message:

error

Type: Function( jqXHR jqXHR, String textStatus, String errorThrown )

A function to be called if the request fails. The function receives three arguments: The jqXHR (in jQuery 1.4.x, XMLHttpRequest) object, a string describing the type of error that occurred and an optional exception object, if one occurred.

So, try this, instead:

error: function(a, b, response) {
     // You can use `a` and `b` if you need them.

     contactForm.addAjaxMessage(response, true);
}

Uncaught TypeError: Cannot read property 'message' of undefined

2 Answers2