fortneci
asked on
JavaScript Error IE only - Using YUI DataTable with XML
I am using the YUI Libray DataTable with XML and generating the XML via JDOM in a
Java Servlet. I got this working in Firefox without any errors, but
when I tested in IE7, the DataTable does not display and I get the
following JavaScript error:
'children' is null or not an object
My XML:
<?xml version="1.0" encoding="UTF-8"?>
<ResultSet>
<Result>
<ROUNDS>3</ROUNDS>
<USERNAME>testuser</USERNA ME>
<BIRDIES>2</BIRDIES>
<PARS>13</PARS>
<BOGIES>28</BOGIES>
<DOUBLES>11</DOUBLES>
<GH>10</GH>
<FH>10</FH>
<PUTTS>108</PUTTS>
<SCORES>264</SCORES>
</Result>
</ResultSet>
My Javascript:
var myColumnHeaders = [
{key:"ROUNDS",text:"Rounds ",type:"nu mber",sort able:true} ,
{key:"USERNAME",text:"User ",sortable :true},
{key:"BIRDIES",text:"Birdi es",type:" number",so rtable:tru e},
{key:"PARS",text:"Pars",ty pe:"number ",sortable :true},
{key:"BOGIES",text:"Bogies ",type:"nu mber",sort able:true} ,
{key:"DOUBLES",text:"Doubl es",type:" number",so rtable:tru e},
{key:"GH",text:"Greens",ty pe:"number ",sortable :true},
{key:"FH",text:"Fairways", type:"numb er",sortab le:true},
{key:"PUTTS",text:"Putts", type:"numb er",sortab le:true},
{key:"SCORES",text:"Scores ",type:"nu mber",sort able:true} ,
];
var myColumnSet = new YAHOO.widget.ColumnSet(myC olumnHeade rs);
// Show over 1000 records
var myDataSource = new YAHOO.util.DataSource("/gw /LeagueSta ndings");
// Set the responseType as XML
myDataSource.responseType = YAHOO.util.DataSource.TYPE _XML;
// Define the data schema
myDataSource.responseSchem a = {
resultNode: "Result", // Node name of each result item
fields:
["ROUNDS","USERNAME","BIRD IES","PARS ","BOGIES" ,"DOUBLES" ,"GH","FH" ,"PUTTS"," SCOR\
ES"]
// Field names
};
var initialRequest = "get=all&output=xml";
var oConfigs = {
initialRequest:initialRequ est,
pageCurrent: 1,
rowsPerPage: 25,
startRecordIndex: 1,
pageLinksLength: 10,
rowsPerPageDropdown: [25,50,100,500]
};
var myDataTable = new YAHOO.widget.DataTable("pa ginated", myColumnSet,
myDataSource, oConfigs);
I am using a Java Servlet to generate the XML. Any assistance would be
greatly appreciated. Thanks
Java Servlet. I got this working in Firefox without any errors, but
when I tested in IE7, the DataTable does not display and I get the
following JavaScript error:
'children' is null or not an object
My XML:
<?xml version="1.0" encoding="UTF-8"?>
<ResultSet>
<Result>
<ROUNDS>3</ROUNDS>
<USERNAME>testuser</USERNA
<BIRDIES>2</BIRDIES>
<PARS>13</PARS>
<BOGIES>28</BOGIES>
<DOUBLES>11</DOUBLES>
<GH>10</GH>
<FH>10</FH>
<PUTTS>108</PUTTS>
<SCORES>264</SCORES>
</Result>
</ResultSet>
My Javascript:
var myColumnHeaders = [
{key:"ROUNDS",text:"Rounds
{key:"USERNAME",text:"User
{key:"BIRDIES",text:"Birdi
{key:"PARS",text:"Pars",ty
{key:"BOGIES",text:"Bogies
{key:"DOUBLES",text:"Doubl
{key:"GH",text:"Greens",ty
{key:"FH",text:"Fairways",
{key:"PUTTS",text:"Putts",
{key:"SCORES",text:"Scores
];
var myColumnSet = new YAHOO.widget.ColumnSet(myC
// Show over 1000 records
var myDataSource = new YAHOO.util.DataSource("/gw
// Set the responseType as XML
myDataSource.responseType = YAHOO.util.DataSource.TYPE
// Define the data schema
myDataSource.responseSchem
resultNode: "Result", // Node name of each result item
fields:
["ROUNDS","USERNAME","BIRD
ES"]
// Field names
};
var initialRequest = "get=all&output=xml";
var oConfigs = {
initialRequest:initialRequ
pageCurrent: 1,
rowsPerPage: 25,
startRecordIndex: 1,
pageLinksLength: 10,
rowsPerPageDropdown: [25,50,100,500]
};
var myDataTable = new YAHOO.widget.DataTable("pa
myDataSource, oConfigs);
I am using a Java Servlet to generate the XML. Any assistance would be
greatly appreciated. Thanks
ASKER
I will run it through firebug and see if I get anything. I wasn't getting anything in the Firefox Error Console.
ASKER
When I call my servlet from IE it will return the XML. Is there a resource that I can use to verify the XML for well formed?
I didn't pick any errors up in Firebug. Below is a snippet of the servlet code that returns the XML.
RStoXML rsxml = new RStoXML(results, "ResultSet", "Result");
//create the XML from recordset
Document jDOMDoc = rsxml.build();
results.close();
XMLOutputter outputter = new XMLOutputter() ;
rep.setContentType("text/x ml");
outputter.output( jDOMDoc, rep.getWriter() );
I didn't pick any errors up in Firebug. Below is a snippet of the servlet code that returns the XML.
RStoXML rsxml = new RStoXML(results, "ResultSet", "Result");
//create the XML from recordset
Document jDOMDoc = rsxml.build();
results.close();
XMLOutputter outputter = new XMLOutputter() ;
rep.setContentType("text/x
outputter.output( jDOMDoc, rep.getWriter() );
ASKER
Here is where I am at with this. If anyone has any other ideas, please share.
I have added a DocType to the XML that is being returned in the response, but still can't seem to pass a XML validator with this DTD and XML: Any Suggestions?
DTD:
<!ELEMENT ResultSet (Results*)>
<!ELEMENT Results ANY>
<!ELEMENT ROUNDS (#PCDATA)>
<!ELEMENT USERNAME (#PCDATA)>
<!ELEMENT BIRDIES (#PCDATA)>
<!ELEMENT PARS (#PCDATA)>
<!ELEMENT BOGIES (#PCDATA)>
<!ELEMENT DOUBLES (#PCDATA)>
<!ELEMENT FH (#PCDATA)>
<!ELEMENT GH (#PCDATA)>
<!ELEMENT PUTTS (#PCDATA)>
<!ELEMENT SCORES (#PCDATA)>
XML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE ResultSet SYSTEM "DTDresultset.dtd">
<ResultSet>
<Result>
<ROUNDS>3</ROUNDS>
<USERNAME>testuser</USERNA ME>
<BIRDIES>2</BIRDIES>
<PARS>13</PARS>
<BOGIES>28</BOGIES>
<DOUBLES>11</DOUBLES>
<GH>10</GH>
<FH>10</FH>
<PUTTS>108</PUTTS>
<SCORES>264</SCORES>
</Result>
</ResultSet>
Also, I am still getting the errror in IE and no errors in FireBug
I have added a DocType to the XML that is being returned in the response, but still can't seem to pass a XML validator with this DTD and XML: Any Suggestions?
DTD:
<!ELEMENT ResultSet (Results*)>
<!ELEMENT Results ANY>
<!ELEMENT ROUNDS (#PCDATA)>
<!ELEMENT USERNAME (#PCDATA)>
<!ELEMENT BIRDIES (#PCDATA)>
<!ELEMENT PARS (#PCDATA)>
<!ELEMENT BOGIES (#PCDATA)>
<!ELEMENT DOUBLES (#PCDATA)>
<!ELEMENT FH (#PCDATA)>
<!ELEMENT GH (#PCDATA)>
<!ELEMENT PUTTS (#PCDATA)>
<!ELEMENT SCORES (#PCDATA)>
XML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE ResultSet SYSTEM "DTDresultset.dtd">
<ResultSet>
<Result>
<ROUNDS>3</ROUNDS>
<USERNAME>testuser</USERNA
<BIRDIES>2</BIRDIES>
<PARS>13</PARS>
<BOGIES>28</BOGIES>
<DOUBLES>11</DOUBLES>
<GH>10</GH>
<FH>10</FH>
<PUTTS>108</PUTTS>
<SCORES>264</SCORES>
</Result>
</ResultSet>
Also, I am still getting the errror in IE and no errors in FireBug
ASKER
Ok, I got this to return valid XML, but I AM STILL GETTING 'children' is null or not an object ERROR in IE. Below is the new XML and DTD
DTD
<!ELEMENT ResultSet (Result)>
<!ELEMENT Result ANY>
<!ELEMENT ROUNDS (#PCDATA)>
<!ELEMENT USERNAME (#PCDATA)>
<!ELEMENT BIRDIES (#PCDATA)>
<!ELEMENT PARS (#PCDATA)>
<!ELEMENT BOGIES (#PCDATA)>
<!ELEMENT DOUBLES (#PCDATA)>
<!ELEMENT FH (#PCDATA)>
<!ELEMENT GH (#PCDATA)>
<!ELEMENT PUTTS (#PCDATA)>
<!ELEMENT SCORES (#PCDATA)>
XML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE ResultSet SYSTEM "DTDresultset.dtd">
<ResultSet>
<Result>
<ROUNDS>3</ROUNDS>
<USERNAME>testuser</USERNA ME>
<BIRDIES>2</BIRDIES>
<PARS>13</PARS>
<BOGIES>28</BOGIES>
<DOUBLES>11</DOUBLES>
<GH>10</GH>
<FH>10</FH>
<PUTTS>108</PUTTS>
<SCORES>264</SCORES>
</Result>
</ResultSet>
DTD
<!ELEMENT ResultSet (Result)>
<!ELEMENT Result ANY>
<!ELEMENT ROUNDS (#PCDATA)>
<!ELEMENT USERNAME (#PCDATA)>
<!ELEMENT BIRDIES (#PCDATA)>
<!ELEMENT PARS (#PCDATA)>
<!ELEMENT BOGIES (#PCDATA)>
<!ELEMENT DOUBLES (#PCDATA)>
<!ELEMENT FH (#PCDATA)>
<!ELEMENT GH (#PCDATA)>
<!ELEMENT PUTTS (#PCDATA)>
<!ELEMENT SCORES (#PCDATA)>
XML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE ResultSet SYSTEM "DTDresultset.dtd">
<ResultSet>
<Result>
<ROUNDS>3</ROUNDS>
<USERNAME>testuser</USERNA
<BIRDIES>2</BIRDIES>
<PARS>13</PARS>
<BOGIES>28</BOGIES>
<DOUBLES>11</DOUBLES>
<GH>10</GH>
<FH>10</FH>
<PUTTS>108</PUTTS>
<SCORES>264</SCORES>
</Result>
</ResultSet>
Do you still get the error when you strip out the <!DOCTYPE ResultSet SYSTEM "DTDresultset.dtd"> ?
ASKER
Yes, because the <!DOCTYPE ResultSet SYSTEM "DTDresultset.dtd"> wasn't originally in the XML. I added the DOCTYPE after I explored the option that my XML was malformed and I used a XML validator to validate this XML with this DTD.
Nothing in your code is jumping out at me - syntax looks OK .... i can suggest hard coding an xml flat file (with the least amount of code necessary) and point yui to the file instead to see if the error has anything to do with the servelet output.
ASKER
Thanks, I haven't tried that yet with the properly formatted XML, I will give that a try and let you know. I have hit a wall with this, so any suggestions are good suggestions. Thanks
ASKER
Found the error. It was in the Javascript, an extra comma at the end of the myColumnHeaders array. Here is the updated Javascript.
var myColumnHeaders = [
{key:"ROUNDS",text:"Rounds ",type:"nu mber",sort able:true} ,
{key:"USERNAME",text:"User ",sortable :true},
{key:"BIRDIES",text:"Birdi es",type:" number",so rtable:tru e},
{key:"PARS",text:"Pars",ty pe:"number ",sortable :true},
{key:"BOGIES",text:"Bogies ",type:"nu mber",sort able:true} ,
{key:"DOUBLES",text:"Doubl es",type:" number",so rtable:tru e},
{key:"GH",text:"Greens",ty pe:"number ",sortable :true},
{key:"FH",text:"Fairways", type:"numb er",sortab le:true},
{key:"PUTTS",text:"Putts", type:"numb er",sortab le:true},
{key:"SCORES",text:"Scores ",type:"nu mber",sort able:true}
];
var myColumnSet = new YAHOO.widget.ColumnSet(myC olumnHeade rs);
// Show over 1000 records
var myDataSource = new YAHOO.util.DataSource("/gw /LeagueSta ndings");
// Set the responseType as XML
myDataSource.responseType = YAHOO.util.DataSource.TYPE _XML;
// Define the data schema
myDataSource.responseSchem a = {
resultNode: "Result", // Node name of each result item
fields:
["ROUNDS","USERNAME","BIRD IES","PARS ","BOGIES" ,"DOUBLES" ,"GH","FH" ,"PUTTS"," SCOR\
ES"]
// Field names
};
var myColumnHeaders = [
{key:"ROUNDS",text:"Rounds
{key:"USERNAME",text:"User
{key:"BIRDIES",text:"Birdi
{key:"PARS",text:"Pars",ty
{key:"BOGIES",text:"Bogies
{key:"DOUBLES",text:"Doubl
{key:"GH",text:"Greens",ty
{key:"FH",text:"Fairways",
{key:"PUTTS",text:"Putts",
{key:"SCORES",text:"Scores
];
var myColumnSet = new YAHOO.widget.ColumnSet(myC
// Show over 1000 records
var myDataSource = new YAHOO.util.DataSource("/gw
// Set the responseType as XML
myDataSource.responseType = YAHOO.util.DataSource.TYPE
// Define the data schema
myDataSource.responseSchem
resultNode: "Result", // Node name of each result item
fields:
["ROUNDS","USERNAME","BIRD
ES"]
// Field names
};
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
You're using the firebug in firefox for this kind of debugging, right ? ;) https://addons.mozilla.org/en-US/firefox/addon/1843