Not Sure Why this only works in IE

[sparkster112]

<script type="text/javascript">

var totalHours = 8;
var exempt = "Y";

function Task(custID, customerName, projectID, projectDescr, taskID, taskDescr)
{
this.CustID = custID;
this.CustomerName = customerName;
this.ProjectID = projectID;
this.ProjectDescr = projectDescr;
this.TaskID = taskID;
this.TaskDescr = taskDescr;
}

var tasks = new Array(); (Various Data Pulls from the server that I deleted)
function validateInput() {
if (form_id.flag.value == "X")
return true;

var hours = 0;
var aTD = document.getElementsByTagName("TD");
for (var i in aTD) {
if (aTD[i].flag == "X" && document.getElementById("CustID" + aTD[i].index).value.length > 0) {
if (document.getElementById("CustID" + aTD[i].index).value.length > 0 && document.getElementById("ProjectID" + aTD[i].index).value.length == 0) {
alert("Project is required");
document.getElementById("ProjectID" + aTD[i].index).focus();
return false;
}

if ((document.getElementById("CustID" + aTD[i].index).value.length > 0 || document.getElementById("ProjectID" + aTD[i].index).value.length > 0) && document.getElementById("TaskID" + aTD[i].index).value.length == 0) {
alert("Task is required");
document.getElementById("TaskID" + aTD[i].index).focus();
return false;
}

if (document.getElementById("Hours" + aTD[i].index).value.length > 0 && isNaN(parseFloat(document.getElementById("Hours" + aTD[i].index).value))) {
alert("Hours can only be numeric");
document.getElementById("Hours" + aTD[i].index).focus();
return false;
}

if ((document.getElementById("CustID" + aTD[i].index).value.length > 0 || document.getElementById("ProjectID" + aTD[i].index).value.length > 0 || document.getElementById("TaskID" + aTD[i].index).value.length > 0) && document.getElementById("Hours" + aTD[i].index).value.length == 0) {
alert("Hours are required");
document.getElementById("Hours" + aTD[i].index).focus();
return false;
}

if (!isNaN(parseFloat(document.getElementById("Hours" + aTD[i].index).value)))
hours += parseFloat(document.getElementById("Hours" + aTD[i].index).value);
}
}

if (exempt != 'Y' && exempt != 'T') {
if (hours > parseFloat(totalHours)) {
alert("Number of hours allocated to projects exceeds hours entered on timesheet (" + totalHours + ").");
return false;
}
}
if (hours < parseFloat(totalHours)) {
alert("Number of hours allocated to projects cannot be less than the hours entered on timesheet (" + totalHours + ").");
return false;
}

return true;
}

function clearAll() {
var aTD = document.getElementsByTagName("TD");
for (var i in aTD) {
if (aTD[i].index != null) {
document.getElementById("CustID" + aTD[i].index).value = "";
document.getElementById("projectContainer" + aTD[i].index).innerHTML = "";
document.getElementById("taskContainer" + aTD[i].index).innerHTML = "";
document.getElementById("Hours" + aTD[i].index).value = "";
}
}
}

function setInitialTasks() {
var aTD = document.getElementsByTagName("TD");
for (var i in aTD) {
if (aTD[i].projectID != null && aTD[i].taskID == null && aTD[i].innerText.length > 0) {
aTD[i].innerHTML = getProjectCombo(aTD[i].index, aTD[i].custID, aTD[i].innerText);
}

if (aTD[i].taskID != null && aTD[i].innerText.length > 0) {
aTD[i].innerHTML = getTaskCombo(aTD[i].index, aTD[i].custID, aTD[i].projectID, aTD[i].innerText);
}
}
}

function getProjectCombo(id, custID, projectID) {
if (custID.length == 0)
return "";
var html = "";
html += "<select id='ProjectID" + id + "' name='record[ProjectID" + id + "]' onchange='taskContainer" + id + ".innerHTML = getTaskCombo(\"" + id + "\",\"" + custID + "\", this.value)' size='1' class='regtxt'>";
html += "<option></option>"
var records = false;
var current = "";
for (var item in tasks) {
if (current == tasks[item].ProjectID)
continue;
current = tasks[item].ProjectID;

if (tasks[item].CustID == custID) {
html += "<option "
if (projectID == tasks[item].ProjectID)
html += "SELECTED ";

html += "value='" + tasks[item].ProjectID + "'>" + tasks[item].ProjectDescr + "</option>"
records = true;
}
}
html += "</select>";
if (records)
return html;
return "No projects for customer";
}

function getTaskCombo(id, custID, projectID, taskID) {
if (projectID.length == 0)
return "";

var html = "";
html += "<select id='TaskID" + id + "' name='record[TaskID" + id + "]' size='1' class='regtxt'>";
html += "<option></option>"
var records = false;
var current = "";
for (var item in tasks) {
if (custID != tasks[item].CustID)
continue;

if (tasks[item].ProjectID == projectID) {
html += "<option "
if (taskID == tasks[item].TaskID)
html += "SELECTED ";
html += "value='" + tasks[item].TaskID + "'>" + tasks[item].TaskDescr + "</option>"
records = true;
}
}
html += "</select>";
if (records)
return html;
return "No tasks for project";
}
</script>



one of our IT guys wrote this who is no longer at the company and i am not very good with CODE ( not really my job) but i was wondering why this does not work in Firefox or Chrome, It only works in IE

please help

thanks

[jscheuer1]

There could also be other cross browser issues with that code. But innerText is an IE proprietary property. The W3C equivalent (recognized by virtually all browsers) is textContent.

If that's the only problem, then replacing the setInitialTasks function with this one should take care of it:


function setInitialTasks() {
var aTD = document.getElementsByTagName("TD");
for (var i in aTD) {
if (aTD[i].projectID != null && aTD[i].taskID == null && (aTD[i].innerText || aTD[i].textContent).length > 0) {
aTD[i].innerHTML = getProjectCombo(aTD[i].index, aTD[i].custID, (aTD[i].innerText || aTD[i].textContent));
}

if (aTD[i].taskID != null && (aTD[i].innerText || aTD[i].textContent).length > 0) {
aTD[i].innerHTML = getTaskCombo(aTD[i].index, aTD[i].custID, aTD[i].projectID, (aTD[i].innerText || aTD[i].textContent));
}
}
}

As a side note, starting with IE 9 textContent is recognized by IE.

[jscheuer1]

I was experimenting with this a little more and there is a difference, it's not exactly equivalent. The textContent property appears to count line breaks (or that might be empty text nodes). So the innertext and textContent of this:


<td>Hi</td>

would be identical, while with this:


<td>
Hi
</td>

There would be two different values. The first has a length of 3 for both properties. The second is still a length of 3 for innerText, but becomes a length of 5 for textContent.

I don't know what the 3rd character would be with the length of 3 and apparently it's included along with the 2 line breaks in the second case when using textContent. Perhaps it's an end-of-data token.

In any case, these two still appear to be equivalent as long as there are no line breaks in the markup.