I'm stuck again... this time the puzzle to solve is why IE cannot write to a dynamically generated form ( "null or not an object" error). Any help with this one much appreciated. Here are the details:
1. The script and the task it supports works in FF but not IE
2. The function works in FF and IE if the form is witten as a part of html
3. Here is the script I'm using to create the form:
4. The form "exists" in IE which I tested adding submit button and hardcoding value for pT elemet. In other words, as far as I know, it is properly constructed and does what is supposed to do.
5. The problem:
In another part of the script I am writing an array of variables (string) into the form with the following:
Code:
document.data.pT.value = packed;
IE throws an error: ".pT is null or not an object" but again, it works in FF and if the form is "hanwritten" into the page.
I tried your suggestion but it didn't make a difference. Now the error is: 'document.data.forms.elements' is null or not an object ... again, only in IE (6.0.28 version).
re: DOCTYPE
Original page is in:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
but even with a "degraded standard" it is not working:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
re: container and html
mypara is a div with id="it"
it's just <div id="it"></div>
the whole function is sitting in the html header between <script></script> tags...
the "post" method supposed to send data to a server which opens a new page in iframe id="iwindow"
IE just can't recognise the element to write into it... The forml works if I create a "submit button" and include some values with the getform() script but I can't write to it new values later on. Also, it works fine if I have a form wirtten in html...
OK, I have encountered this same problem just recently when doing some work for a client. The problem is that IE doesn't update its outerHTML property value for changes to the name attribute. In my case, I was cloning existing elements and having to increment the numeric suffix of the element names and, thus, I had to do a replace of the old name with the new name in the outerHTML property. In your case, you just need to add the name attribute to the outerHTML property. Here is what I came up with for you:
Code:
function getform(){
var mydiv=document.getElementById("it");
var myform=document.createElement("form");
myform.setAttribute("name", "data");
myform.setAttribute("method", "post");
myform.setAttribute("action", "http://www.xxx.php");
myform.setAttribute("target", "iwindow");
var myinput=document.createElement("input");
myinput.setAttribute("type", "hidden");
myinput.setAttribute("name", "pT");
myinput = myform.appendChild(myinput);
myform = mydiv.appendChild(myform);
myinput.outerHTML = myinput.outerHTML.replace(/>/, " name="+myinput.name+">");
myform.outerHTML = myform.outerHTML.replace(/>/, " name="+myform.name+">");
}
Ha, now the script works as it should! I can now safely create forms on the go and it works in FF and IE (and N8.1). Another puzzle solved thanks to you!
I have pretty much the same code except that i already have a form created and i am pulling fields from an array that my server returned. I had it all working in Firefox, but stumbled upon the name problem with IE. I saw this post and i did the suggested and it works in IE now but not in FF. I get an error in FF that says "newInput.outerHTML has no properties". Do i need to put a condition in to only run the outerHTML code when the client browser is IE? Thanks!
Code:
{
var myDiv = document.getElementById("tab2")
var i = 0;
while(i<r.form_array.length)
{
//CREATE BREAKS
newBreak = document.createElement('br');
newBreak2 = document.createElement('br');
//CREATE LABEL
newLabel = document.createElement('label');
newLabelText = document.createTextNode(r.form_array[i][0]);
newLabel.appendChild(newLabelText);
//CREATE FORM ELEMENT AND ASSIGN PROPERTIES
newInput = document.createElement('input');
newInput.setAttribute('name',r.form_array[i][1]); //UNRESOLVED
newInput.setAttribute('maxLength',r.form_array[i][3]);
newInput.setAttribute('className','textField'); //FOR HORRIBLE IE
newInput.setAttribute('class','textField'); //FOR WONDERFUL FIREFOX
newInput.setAttribute('onBlur',r.form_array[i][2]); //FOR WONDERFUL FIREFOX
//APPEND TO DOCUMENT
myDiv.appendChild(newLabel);
myDiv.appendChild(newBreak2);
newInput = myDiv.appendChild(newInput);
myDiv.appendChild(newBreak);
newInput.outerHTML = newInput.outerHTML.replace(/>/, " name ="+newInput.name+">");
i++;
}
}
once you use outerHTML.replace to force element.name to be recognized, it will break the attachEvent functionality in IE. I am currently at an em passe because I cannot seem to use the outerHTML.replcace fix to allow me to getElementsByName AND attachEvent on the same element
If someone knows different, or knows how...please post here?
Bookmarks