childNodes not working in Firefox and Chrome but working in IE

I have a gridview in its 3rd cell, there is textbox control, I am calling javascript function on onchange.

Can some body tell me why this is not working in Firefox and Chrome but working in IE

grd.rows[rowindex].cells[3].childNodes[0].value

It return correct value in IE but not in Chrome and 开发者_如何学Gofirefox (In FF and Chrome it return undefined)?

Please also suggest me solution to handle this problem.

Edit

alert(grd.rows[ri].cells[3].childNodes[0].value);//IE value=correct value, FF and chrome value=undfined
alert(grd.rows[ri].cells[3].childNodes[1].value);//IE value=undfined, FF and Chrome value= correct value

Thanks

I believe that this is because IE ignores text nodes that only contain newlines and tabs. Personally I prefer they be ignored but I would rather have consistency across the browsers.

<p><!-- This comment represents a text node.
    --><em>text</em>
</p>

try grd.rows[rowindex].cells[3].childNodes[1].value

or the best, look at table in integrated Developer tool

Try out this. I have same problem and this problem is resolved by just replace "childNodes" with "children"

alert(grd.rows[ri].cells[3].children[0].value);

@ChaosPandion:

Hey friend don't use this type of check for childNodes.

The counting of childNodes varies. Some browsers include empty textNodes, some do not. In this sort of operation as I believe you are describing, it is better to use the parent's getElementsByTagName() method. That way the number of chidren and index of each child you are looking for will be consistent.

OR

just check your browser's name.

if it is IE then as it neglects empty textnode, the childNode in it is less by one number than other browsers.

for eg.

var isIE = navigator.appName;
if (isIE == "Microsoft Internet Explorer") {                
    var removeProductID = document.getElementById(obj.childNodes[0].id).getAttribute("abc");
}
else {
    var removeProductID = document.getElementById(obj.childNodes[1].id).getAttribute("abc");
}

Hope this helps. Enjoy coding.

If you are looking for the text, use grd.rows[rowindex].cells[3].childNodes[0].data for non-IE browsers.

Getting text value of an Element Node

var oCell = grd.rows[rowindex].cells[3];
alert(oCell.textContent || oCell.innerText)

Getting text value of a Text Node (less safe compared to previous)

var oText = grd.rows[rowindex].cells[3].childNodes[0];
alert(oCell.data || oCell.value)

As ChaosPandion says, IE ignores white-space text-nodes. The following should work cross-browser:

var cell = grd.rows[rowindex].cells[3];
for (var textbox=cell.firstChild; textbox.nodeType!==1; textbox=textbox.nextSibling);
alert(textbox.value);

However, you say you are calling the function on onchange. Presumably that means the onchange event for the textbox in question. In that case the event argument in your event handler should have a pointer to the textbox. Look at the target or srcElement property. e.g.

function onChange(e) {
 e = e || window.event;
 var textbox = e.target || e.srcElement;
 alert(textbox.value);
}

try getElementsByTagName() instead of ChildNodes. it will be working for FF , chrome and for IE as well.