Appended input node is not connected to form

[André Hänsel]

Hi,

I'm using Ajax to load a block of HTML into a page:

coll.appendChild(xmlHttp.responseXML.firstChild)

In the response there is a hidden input field:
<div><input type="hidden" name="partners[]" value="12"/><p
class="name">Foo Bar</p></div>

This input field is not connected to the surrounding form. When I
inspect it in Firebug I see that it did not get a "form" property and
when I submit the form, it is not included.

What is the solution, innerHTML?

Regards,
André

 

[Martin Honnen]

I'm using Ajax to load a block of HTML into a page:

coll.appendChild(xmlHttp.responseXML.firstChild)

In the response there is a hidden input field:
<div><input type="hidden" name="partners[]" value="12"/><p
class="name">Foo Bar</p></div>

This input field is not connected to the surrounding form. When I
inspect it in Firebug I see that it did not get a "form" property and
when I submit the form, it is not included.

Well it is _XML_HttpRequest and response_XML_ so what you load there is
most likely an XML element which happens to have the name 'input' and is
in no namespace. While the browser might not complain when you move that
XML element into a HTML document it does not magically transform that
XML 'input' element into a HTML 'input' element.
What you can do with browsers like Mozilla or Opera is to send XHTML e.g.
<input xmlns="http://www.w3.org/1999/xhtml" type="hidden" .../>
and then you will have an XHTML 'input' element in responseXML that you
can import into your HTML document e.g.
coll.appendChild(document.importNode(xmlHttp.responseXML.firstChild,
true));
In the latest version of Mozilla you could also do
coll.appendChild(document.adoptNode(xmlHttp.responseXML.firstChild));
instead which should be more efficient than importNode. But both
approaches require that the server sends XHTML i.e. element with name
'input' in the XHTML 1 namespace http://www.w3.org/1999/xhtml.

And with IE that approach does not work at all as the XML DOM is
implemented by MSXML and the HTML DOM by MSHTML and there is no
adoptNode/importNode at all supported.

 

[André Hänsel]

And with IE that approach does not work at all as the XML DOM is
implemented by MSXML and the HTML DOM by MSHTML and there is no
adoptNode/importNode at all supported.

Then it seems that my idea of how Ajax technology is implemented is
fundamentally wrong. Could you point me to some literature?

 

[David Mark]

Then it seems that my idea of how Ajax technology is implemented is
fundamentally wrong. Could you point me to some literature?

The idea of downloading HTML document fragments by XHR is flawed. You
can either deal with importing XML or use innerHTML. Neither is
ideal. Most go for the latter.

Download data instead. That's what JSON is for.