Hi all,
How do you read specific <div> tag from responsetext?
And also, is it possible to count how many <div> tag are there in responsetext?
I have been googling for quite sometime but didn't find any tutorial or explanation nor answer.
Thanks for the help.
Okay, here's the situation ...
I thought this would be a handy thing to know and am planning on rebuilding my javascript ajax class soon anyway.
What you need to do is two-fold
1. On the server-side script that returns the results you need to set the 'Content-type" to "application/xml" -- this varies by server-side language, but in PHP it looks like this
<?php
header( 'Content-type: application/xml; charset="utf-8"');
print <<<ENDHTML
<html>
<div>
<div>Some block content goes here</div>
</div>
<div>Some more content goes here</div>
</html>
ENDHTML;
?>Remember that xml requires a single enclosing container, so I used <html>, but it could be anything -- so long as you do NOT do this ...
<?php
header( 'Content-type: application/xml; charset="utf-8"');
print <<<ENDHTML
<div>
<div>Some block content goes here</div>
</div>
<div>Some more content goes here</div>
ENDHTML;
?>... which creates two root-level enclosing containers (the two <div> tags)
2. You need to grab your Ajax results as responseXML and not responseText, so ...
respXML = httpAgent.responseXML;
var divs = respXML.getElementsByTagName('div');
alert( divs.length );... inside your Ajax function/method.
From here you can do any JavaScript DOM methods on the responseXML.
Hope this helps
I so lied !
I can't seem to get elements of the XML using javascript DOM methods in other ways than using getElementsByTagName('tag');
but I'm still working on it, will post back here with any updates.
Ciao
Right-O,
It's not as handy as being able to use getElementById() but this sort of thing is working and can be used to get the same results.
var divs = respXML.getElementsByTagName('div');
for ( i = 0; i < divs.length; i ++ ) {
if ( divs.item(i).getAttribute('id') == 'last_div' ) {
alert( divs.item(i).firstChild.nodeValue );
} else {
alert( divs.item(i).nodeName + ' :: ' + divs.item(i).getAttribute('id') );
}
}Here's my altered PHP code
<?php
header( 'Content-type: application/xml; charset="utf-8"' );
print <<<ENDHTML
<html>
<div id="first_div">
<div id="nested_div">Some block content goes here</div>
</div>
<div id="last_div">Some more content goes here</div>
</html>
ENDHTML;
?>*Note: All of my dev was done in FF 3 and then verified in IE 7
Hope this helps
Hi,
Just for future reference. The solution for this is by using createElement("div")
First declare a variable by using createElement
var tempEle = document.createElement("div");Then, store the responsetext into the innerHTML of that element variable
tempEle.innerHTML = html;From there, you can use any getElement command and retrieve information from that variable.
var someID = tempEle.getElementById("hello");
alert(someID.innerHTML);No server-side code is needed for this.
Hi,
Just for future reference. The solution for this is by using createElement("div")
First declare a variable by using createElement
var tempEle = document.createElement("div");Then, store the responsetext into the innerHTML of that element variable
tempEle.innerHTML = html;From there, you can use any getElement command and retrieve information from that variable.
var someID = tempEle.getElementById("hello"); alert(someID.innerHTML);No server-side code is needed for this.
Wanted to thank you for that piece of information. It's good to know and will certainly come in handy ...
Thanks
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.