Entry
How to add a FORM to a layer?
How to add a FORM to a layer?
Jul 12th, 2000 07:13
Jeremy Bowers, Martin Honnen,
As NN4 and NN6 have no way to access the html source of an element it
is
best to keep the layer source in a js string variable. Then you can use
the known methods to
document.write to the layer for NN4
insert a document fragment parse with
document.createRange.createContextualFragment
for NN6
set innerHTML for IE4/5
Note that Mozilla as of Milestone 16 (released June 13, 2000) also has
innerHTML like IE4/5, so it will not be necessary to use the
createContextualFragment in the final NN6.
<HTML>
<HEAD>
<STYLE>
#aLayer { position: absolute;
left: 10px; top: 200px;
background-color: lime;
layer-background-color: lime;
}
</STYLE>
<SCRIPT>
var layerContent = '<P>Kibology for all<\/P>';
var form = '<FORM NAME="aForm"><INPUT TYPE="text" NAME="aField"
VALUE="Kibology"><\/FORM>';
function addForm () {
layerContent += form;
writeToLayer ('aLayer', layerContent);
}
function writeToLayer (id, html) {
if (document.layers) {
var l = document[id];
l.document.open();
l.document.write(html);
l.document.close();
}
else if (document.all) {
document.all[id].innerHTML = html;
}
else if (document.getElementById) {
var range = document.createRange();
var l = document.getElementById('aLayer');
while (l.hasChildNodes())
l.removeChild(l.firstChild);
range.setStartAfter(l);
var docFrag = range.createContextualFragment(html)
l.appendChild(docFrag);
}
}
</SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript: addForm(); void 0">
add form
</A>
<DIV ID="aLayer">
<SCRIPT>
document.write(layerContent);
</SCRIPT>
</DIV>
</BODY>
</HTML>
