AJAX not updating innerHTML

[treeleaf20]

All I have the following code:

<form name="testimonial" id="testimonial" method="post" action="">
<table border="0" cellspacing="3" cellpadding="3">
<tr>
<td valign="top">Name:</td>
<td><input type="text" name="name" id="name" value="Enter your name" onfocus="if(this.value=='Enter your name'){this.value=''}"/></td>
</tr>
<tr>
<td valign="top">Message:</td>
<td><textarea name="message" id="message" cols="30" rows="10" onfocus="if(this.value=='Enter in a testimonial'){this.value=''}">Enter in a testimonial</textarea></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type="submit" name="submit" value="Submit Testimonial" onclick="get(this.parentNode);"/></td>
</tr>
</table>
</form>

Then I submit it using an AJAX code. I try and reset these values using the following code:

http_request.onreadystatechange = function() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
//alert(http_request.responseText);
result = http_request.responseText;
document.getElementById(SpanName).innerHTML = result;
document.getElementById('name').innerHTML = 'Enter your name';
document.getElementById('message').innerHTML = 'Enter your message';
} else {
alert('There was a problem with the request.');
}
}
};
http_request.open('POST', url, true);
http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http_request.setRequestHeader("Content-length", parameters.length);
http_request.setRequestHeader("Connection", "close");
http_request.send(parameters);
}

However, it doesn't work. Any ideas why? Thanks in advance!

[Fou-Lu]

This isn't a php issue. Moving from php to js/ajax forum.

[rfresh]

Where is spanName? I don't see it in your table code.

[basilas]

change the

"<input type="submit" name="submit" value="Submit Testimonial" onclick="get(this.parentNode);"/>"

to

"<input type="button" name="submit" value="Submit Testimonial" onclick="get(this.parentNode);"/>"

[treeleaf20]

The SpanName is an actually a div and it has some PHP in it. It has nothing to do with the table. So basically I'm trying to display a query that gets executed in the div and then actually resetting the name and message fields back to their original field values that I showed in the original post.

[Dormilich]

all form control (<input>, <select>, <textarea>) values (the text within) is read/set via the value property.

[treeleaf20]

So just make it:

document.getElementById('message').innerHTML.value = 'Enter your message';

??

[Dormilich]

that should give you: "… is null or not an object"

the value property belongs to the form element object.

[treeleaf20]

So then how can I do this? Since I don't have a <form> in my JS file.

[Dormilich]

you’re thinking too complicated. you may not have a <form> tag in your script, but you certainly have a form element object.

[treeleaf20]

Ahh, dumb move on my part. I fixed it by doing this:

document.testimonial.name.value = "Enter your name";
document.testimonial.message.value = "Enter your message";

Thanks for pointing it out.