Jump to content
Larry Ullman's Book Forums
wadesmart

Ch5, Pg77 Var Errors Returns Null

Recommended Posts

var errors = data.getElementsByTagName('error');

 

When I run the page my Firefox error console says:

data is null

add_employee.js line 44 -> which is the above line.

 

I checked my code against that downloaded from

the site and found no errors so I ran the code

from the site and had the same issue.

 

Ive been going over the code to see if I understand

what is happening but I just dont understand js

enough and what could be causing the errors.

 

wade

Share this post


Link to post
Share on other sites

No, I mean the actual response from the actual server-side request. In other words, what the Ajax PHP script returns. Confirming that is always the first debugging step when it comes to Ajax.

Share this post


Link to post
Share on other sites

Ok. Thanks for you response Larry.

After looking through the book and over the code, I dont understand how to do that yet.

Ill just put this book away until I understand js better.

Share this post


Link to post
Share on other sites

What your error is saying is that the variable named "data" either doesn't exist or it does, but is equal to null. Most likely, the former is the case.

 

The getElementsByTagName method can only be called from DOM objects. If "data" is supposed to be a DOM object (but isn't), you should start by trying to figure out what's up with that. If you wanna post some code, we can maybe help you better.

 

Thanks.

Share this post


Link to post
Share on other sites

Hartley, Im working with the code right out of the book that this forum is named after:

 

 

//add_employee.js
window.onload = init;
function init(){
var ajax = getXMLHttpRequestObject();

if(ajax){
 if(document.getElementById('results')){
  document.getElementById('emp_form').onsubmit = function(){
 ajax.open('post', 'add_employee_xml.php');

 ajax.onreadystatechange = function() {
  handleResponse(ajax);
 }

 var fields = ['first_name', 'last_name', 'email', 'department_id', 'phone_ext'];

 for(var i = 0; i < fields.length; i++){
  fields[i] = fields[i] + '=' + encodeURIComponent(document.getElementById(fields[i]).value);
 }
 var values = fields.join('&');
 //alert(values);

 ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

 ajax.send(values);
 return false;
   }
 }
}
}
function handleResponse(ajax){
if(ajax.readyState == 4){
 if((ajax.status == 200) || (ajax.status == 304)) {

  var results = document.getElementById('results');

  document.getElementById('first_name_label').className = 'title';
  document.getElementById('last_name_label').className = 'title';
  document.getElementById('email_label').className = 'title';
  document.getElementById('department_id_label').className = 'title';
  document.getElementById('phone_ext_label').className = 'title';


  var data = ajax.responseXML;
  alert(data);

  var message = data.getElementsByTagName('result');
  var errors = data.getElementsByTagName('error');
  var temp = false;

  for(var i=0; i < errors.length; i++){
   temp = errors[i].firstChild.nodeValue;
   document.getElementById(temp + '_label').className = 'error';
  }

  results.innerHTML = message[0].firstChild.nodeValue;
  results.style.display = 'block';

 } else {
  document.getElementById('emp_form').submit();
 }
}
}

 

and then the page its calling:

 

<!--?php #add_employee_xml.php
header("Content-Type=text/xml");
echo '<?xml version="1.0" encoding="utf-8" standalone="yes" ?-->
<response>
';

require_once('mysql.inc.php');
$error = false;

if(!empty($_POST['first_name'])){
 $fn = mysql_real_escape_string($_POST['first_name'], $dbc);
} else {
 $error = true;
 echo '<error>first_name</error>
 ';
}

if(!empty($_POST['last_name'])){
 $ln = mysql_real_escape_string($_POST['last_name'], $dbc);
} else {
 $error = true;
 echo '<error>last_name</error>
 ';
}

if(!empty($POST['email'])){
 $e = mysql_real_escape_string($_POST['email'], $dbc);
} else {
 $error = true;
 echo '<error>email</error>
 ';
}

if(isset($_POST['department_id']) && is_numeric($_POST['department_id']) && ($_POST['department_id'] > 0)){
 $did = (int) $_POST['department_id'];
} else {
 $error = true;
 echo '<error>department_id</error>
 ';
}

if(isset($_POST['phone_ext']) && is_numeric($_POST['phone_ext']) && ($_POST['phone_ext'] > 0)) {
 $ext = (int) $_POST['phone_ext'];
} else {
 $error = true;
 echo '<error>phone_ext</error>
 ';
}

// no errors
if(!$error){
 $query = "INSERT INTO employees (department_id, first_name, last_name, email, phone_ext) VALUES (NULL, $did, '$fn', '$ln', '$e', $ext)";

 $result = mysql_query($query, $dbc);

 if(mysql_affected_rows($dbc) == 1){
  echo '<result>The employee has been added.</result>
  ';
 } else {
  echo '<result>The employee could not be added due to a system error.</result>
  ';
 }

} else {
 echo '<result>Please correct problems with the highlighted field(s) below.</result>
 ';
}

mysql_close($dbc);
echo '</response>
';
?>

 

I went back through and put the '; on a new line just like in the book thinking maybe it had to be that way to not mess up the xml.

Share this post


Link to post
Share on other sites

Here's your problem, right here:

var data = ajax.responseXML;

 

For whatever reason, nothing is being output from the add_employee_xml.php script.

To be honest, I always use responseText and not responseXML, so I'm not sure what is causing this problem, but I do know that XML is very temperamental. Unless XML syntax is 100% correct, an error will occur and nothing works.

 

You may want to double-check your XML syntax in the add_employee_xml.php script. There may be some small typo. In the meantime, I will look into what could potentially be causing this error. Please be patient and let me know if you find anything.

 

Thanks.

  • Upvote 1

Share this post


Link to post
Share on other sites

The more I look at your code, the more I'm wondering about the first line in your PHP file.

<!--?php #add_employee_xml.php

 

Is that right? I could be wrong, but doesn't the opening PHP tag have to be "<?php"?

 

If the opening tag is wrong, then I imagine that the entire PHP script is skipped over, in which case, nothing will be stored in responseXML.

  • Upvote 1

Share this post


Link to post
Share on other sites

Im just looked at that.... the <!-- isnt in my code.

Its only in the code I posted here.

 

This is what I have

 

 

<?php #add_employee_xml.php

header("Content-Type=text/xml");

echo '<?xml version="1.0" encoding="utf-8" standalone="yes" ?>

<response>

';

Share this post


Link to post
Share on other sites

Ok.. I noticed it only did that with the php tag at the top and thought maybe the page logic

inserted the dashes itself but the above test says it didnt.

 

Anyway, I dont know why that showed up but its not in my actual code.

Share this post


Link to post
Share on other sites

In any case, the next step would be to verify the result that add_employee_xml.php returns. If your browser has a network monitor, it will show the request details, including the response.

Share this post


Link to post
Share on other sites

Yeah, like what Larry said, I recommend trying to return a very basic string from the add_employee_xml.php script, and try to grab it on the JS side with responseText. If that works, then you know there is a problem somewhere in the add_employee_xml.php script.

Share this post


Link to post
Share on other sites

FOUND IT!!!

 

header("Content-Type=text/xml"); should be header("Content-Type:text/xml");

 

Changed that - its all fine.

 

OMGOSH that is crazy that one little thing like a = instead of a : can do that.

 

Ok.. thanks for the help - moving on with the book :D

Share this post


Link to post
Share on other sites

Excellent. Kudos for figuring that out and thanks for sharing the solution. That is the joy of programming: one little mistake can render everything useless!

Share this post


Link to post
Share on other sites

Yes, that's the way XML is. It's good in that it keeps you honest in your coding, but can be frustrating.

I certainly didn't have the XML header memorized, so I would have never spotted that.

 

Good job!

Share this post


Link to post
Share on other sites

Oh, wait, my bad. I just realized what you were talking about, the header function in PHP. Yes, that is right. The colon is required.

I didn't even notice that when I looked at your code. Nice!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×