Adding a Row to Parent Table is not working

[John]

In my script

<script language="javascript">
function AddItinerary()
{
var newRow;
var newCell1,newCell2,newCell3,newCell4,newCell5,newCell6;

newRow = document.createElement("tr");
newCell1 = document.createElement("td");
newCell2 = document.createElement("td");
newCell3 = document.createElement("td");
newCell4 = document.createElement("td");
newCell5 = document.createElement("td");
newCell6 = document.createElement("td");

var depdate = AirItineraryForm.DepDate_TextBoxID.value + " " +
AirItineraryForm.cmbDepHH + ":" + AirItineraryForm.cmbDepMM;
var arrdate = AirItineraryForm.ArrDate_TextBoxID.value + " " +
AirItineraryForm.cmbArrHH + ":" + AirItineraryForm.cmbArrMM;

newCell1.innerHTML = "<span
style=\"color:#003366;font-family:Trebuchet MS;font-size:X-Small;\">"
+ AirItineraryForm.txtDepFrom.value + "</span>";
newCell2.innerHTML = "<span
style=\"color:#003366;font-family:Trebuchet MS;font-size:X-Small;\">"
+ AirItineraryForm.txtDesig.value + "</span>";
newCell3.innerHTML = "<span
style=\"color:#003366;font-family:Trebuchet MS;font-size:X-Small;\">"
+ depdate + "</span>";
newCell4.innerHTML = "<span
style=\"color:#003366;font-family:Trebuchet MS;font-size:X-Small;\">"
+ arrdate + "</span>";
newCell5.innerHTML = "<span
style=\"color:#003366;font-family:Trebuchet MS;font-size:X-Small;\">"
+ AirItineraryForm.txtClass.value + "</span>";
newCell6.innerHTML = "<span
style=\"color:#003366;font-family:Trebuchet MS;font-size:X-Small;\">"
+ AirItineraryForm.txtFlight.value + "</span>";

newRow.appendChild(newCell1);
newRow.appendChild(newCell2);
newRow.appendChild(newCell3);
newRow.appendChild(newCell4);
newRow.appendChild(newCell5);
newRow.appendChild(newCell6);
/**************************************************************/
alert("About to add"); // upto this it is working
/**************************************************************/
/* Not Working after this line */
/***************************************************************
window.opener.tblAirTravel.firstChild.appendChild(newRow);
alert("Added to Table");
return true;
}

What i have to do to add a row dynamically to the table in the parent
window?

Thanks in Advance
John.

 

[Martin Honnen]

John wrote:

window.opener.tblAirTravel.firstChild.appendChild(newRow);

Well first of all you seem to want to insert your table rows created in
one window into a table in another window. That works with Mozilla but
the DOM requires you to import such nodes and for instance Opera 7
requires that. And with IE/Win the whole thing is not possible at all,
there you need
newRow = window.opener.document.createElement('tr');
There might be other problems, from what you show above it is not clear
what tblAirTravel is, what its firstChild is. You should normally append
rows to a tbody or thead or tfooot element, in particular IE requires
that. And for Mozilla you probably need
window.opener.document.getElementById('tblAirTravel')
but all that is guessing, you need provide more information.

 

[Fred Oz]

Martin Honnen wrote:
[...]

There might be other problems, from what you show above it is not clear
what tblAirTravel is, what its firstChild is.

[...]

Good point, particularly "what its firstChild is". The general way is
to use the rows collection to find the row you want to add the new one
after, then use insertBefore and nextSibling.

If there is no nextSibling (i.e. you want to add it after the last
row), then that is what happens.

It's also worth noting that rows can't be parents (or children) of
other rows. So even if firstChild was a row, and indeed another was
added as a child, the results would be unreliable at best.

If you want to just toss the row in the general direction of the table
and let the browser work out how to add it, then use appendChild on the
table itself, this adds it to the end of the table body reasonably
reliably.

Rob.

 

[Fred Oz]

Martin Honnen wrote:
[...]

There might be other problems, from what you show above it is not clear
what tblAirTravel is, what its firstChild is. You should normally append
rows to a tbody or thead or tfooot element, in particular IE requires
that.

[...]

Good point, particularly "what its firstChild is". The general way is
to use the rows collection to find the row you want to add the new one
after, then use insertBefore and nextSibling.

If there is no nextSibling (i.e. you want to add it after the last
row), then that is what happens.

It's also worth noting that rows can't be parents (or children) of
other rows. So even if firstChild was a row, and indeed another was
added as a child, the results would be unreliable at best.

If you want to just toss the row in the general direction of the table
and let the browser work out how to add it, then use appendChild on the
table itself, this adds it to the end of the table body reasonably
reliably.

Fred.

 

[Martin Honnen]

Fred Oz wrote:

If you want to just toss the row in the general direction of the table
and let the browser work out how to add it, then use appendChild on the
table itself, this adds it to the end of the table body reasonably
reliably.

No, at least with MSIE/Win you need to make sure you call appendChild on
a tbody (or thead or tfoot) element, if you call appendChild on a table
itself passing in a row as the argument IE doesn't render the row at all
so what you suggest above is not a good suggestion, the leading browser
in terms of market share doesn't "work out how to add it".