FireFox problem with innerHTML

[sveinn]

Hi all,

I've read through this group searching for an answear about this
problem.
Few have come close but not quite what I need.
My problem is this: I'm using Ajax to fetch a new table with input
boxes. I then take
the innerHTML from my <div> and add the new table to the existing
one/s.
What happens in FireFox is that all values in other tables input boxes
on the specific
<dif> are erased.
When I use alert boxes to show the innerHTML, IE shows the other
inputboxes with the
value attribute set to the right value but the FF does not. By default
when a new table is
created (added to the div) I don't use the value attribute.
Does this make sense?

I think I've come to the conclusion that since innerHTML is a IE thing
and not a standard
its not supposed to work........

Hope someone can help,
Sveinn

 

[Martin Honnen]

My problem is this: I'm using Ajax to fetch a new table with input
boxes. I then take
the innerHTML from my <div> and add the new table to the existing
one/s.

Are you using e.g.
div.innerHTML = div.innerHTML + stringWithTableHTML
? If so don't do that, that way the browser has to first serialize the
contents of the div to HTML, then concatenate the two string and in the
last step parse the complete HTML again although all you really need to
parse is the new HTML.
If you want to add some HTML snippet to an existing element then IE and
Opera implement insertAdjacentHTML for that e.g.
div.insertAdjacentHTML(
'beforeEnd',
stringWithTableHTML
)
and with Mozilla you can emulate that respectively implement it
yourself, see
<http://www.faqts.com/knowledge_base/view.phtml/aid/5756/fid/255>
and/or
<http://webfx.eae.net/dhtml/ieemu/>
That way your problem goes away and your code is much more efficient as
the browser only parses the new HTML and inserts the created nodes
instead of serializing existing nodes and reparsing them.

 

[RobG]

Hi all,

I've read through this group searching for an answear about this
problem.
Few have come close but not quite what I need.
My problem is this: I'm using Ajax to fetch a new table with input
boxes. I then take
the innerHTML from my <div> and add the new table to the existing
one/s.
What happens in FireFox is that all values in other tables input boxes
on the specific
<dif> are erased.
When I use alert boxes to show the innerHTML, IE shows the other
inputboxes with the
value attribute set to the right value but the FF does not. By default
when a new table is
created (added to the div) I don't use the value attribute.
Does this make sense?

IE updates the innerHTML property of input elements so that their value
attribute reflects the current input. Gecko browsers (and probably
others) don't - innerHTML shows whatever value was in the original
source (if any).

e.g.:

<span id="xx"><input type="text" value="blah"></span>
<input type="button" value="Show innerHTML"
onclick="alert(document.getElementById('xx').innerHTML);">


If the value of the text input is changed, in Firefox its innerHTML
value attribute is always 'blah', in IE it is whatever the current value is.

This has been raised in Bugzilla and dismissed as a bug in IE's
getAttribute method.

The issue highlights a problem with innerHTML - there is no HTML
attribute equivalent for the DOM defaultValue attribute. So if you use
innerHTML to clone the input, in IE the new input will have a default
value of whatever was the value of the cloned input when it was cloned,
in Gecko browsers the default value will be the same as the original,
regardless of what the content was at the time.

I think you could argue that either approach is 'correct', but the point
is that Gecko browsers don't do what IE does for innerHTML when they
probably should.

It leads to a bigger issue with serializers in that the DOM may have
element attributes and values that can't be reflected in the document's
serialized form (HTML, XML, whatever).

I think I've come to the conclusion that since innerHTML is a IE thing
and not a standard
its not supposed to work........

There's no public standard on how it should work so all you can really
say is that whatever IE does is right.