Going crazy trying to find this. Any help would be appreciated.
Problem is that this code does 'nothing' in IE7/8/8compatmode. Works fine in Chrome 15.0.8 and FF3.5, as well as Opera 11.60.
It uses a xml file to read via ajax, and then places it in the table. I've tried several things I'll detail after the code.
XML:
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<issues>
<issue>
<id>12</id>
<emp>44</emp>
<author>1</author>
<comments>Example comments go here</comments>
<issueDate>12/5/2011</issueDate>
<modifiedBy />
<modifiedDate />
<modifiedComments />
<pending>true</pending>
<valid>false</valid>
</issue>
</issues>
javascript:
<script type="text/javascript">
$(document).ready(function () {
grabIssues('2011/12/01', '2011/12/13');
});
function grabIssues(startDate, endDate) {
$.ajax({
type: "POST",
url: "Ajax/mtlIssues.aspx",
data: {
startDate: startDate,
endDate: endDate
},
dataType: ($.browser.msie) ? "text" : "xml",
success: function (result) {
createIssues(result);
}
});
}
function createIssues(xml) {
var data = "";
//newIssueArray = [];
$("issue", xml).each(function (id) {
message = $("issue", xml).get(id);
$id = $("id", message).text();
$emp = $("emp", message).text();
$author = $("author", message).text();
$comments = $("comments", message).text();
$issueDate = $("issueDate", message).text();
$pending = $("pending", message).text();
$valid = $("valid", message).text();
//$("#empList").append("<tr><td>" + $emp + "</td><td>" + $issueDate + "</td><td>" + $comments + "</td><td>" + $pending + "</td></tr>");
//newIssueArray.push("<tr><td>" + $emp + "</td><td>" + $issueDate + "</td><td>" + $comments + "</td><td>" + $pending + "</td></tr>");
data += "<tr><td>" + $emp + "</td><td>" + $issueDate + "</td><td>" + $comments + "</td><td>" + $pending + "</td></tr>";
});
//$("#empList").html("");
//for (i in newIssueArray) {
//$("#empListDetails").append(newIssueArray[i]);
//data += newIssueArray[i];
//}
//$("#empList").append("</table>");
$("#empListDetails").html(data);
}
</script>
partial html
<div id="empList" class="ui-widget">
<table id='empListTable'>
<thead>
<tr><th>Name</th><th>Date</th><th>Comments</th><th>Pending</th></tr>
</thead>
<tbody id='empListDetails'></tbody>
</table>
</div>
What I've tried: As you can tell by commented code left in, I've tried everything from creating an array to using a variable, to directly appending each to the page as it is detected.
- I've also tried to have just a blank div (empList) and create the entire table in the javascript and use the .html() to insert it. Didn't work. Nor did append.
- I've coded this several ways, and all work in FF/Chrome/Opera. But I can't even get IE7/8/8compatmode to even give me an error. Just nothing happens
- I upgraded JQuery to 1.7.1 from 1.4.2 and tried all variations again. Hoping it was perhaps a bug caught by the Jquery team and not my code directly. Didn't work.
- Also note, I removed the 'modified' portions from the javascript. It was there, but the issue has persisted before/after.
- This shows nothing entered at all on the f12/dev console in IE8. Isn't placing any text at all in there.
Any assistance would be appreciated.
$.parseXMLapi.jquery.com/jQuery.parseXML