Mac OS X IE 5.2 vs javascript

[Robin Becker]

I'm trying to fix a problem in IE 5.2 javascript on mac OS 10.2.

Basically the problem is that we're writing dynamic form elements and these
don't seem to be recognized by the form.

The code that does the writing looks like
///////////////////////////////////////
var IE4 = document.all ? 1 : 0;
var NS4 = document.layers ? 1 : 0;
var DOM = (!IE4 && document.getElementById) ? 1 : 0;

function wlayer(name,html){
var out;
if(NS4){
out = document.layers[name];
out.document.open();
out.document.write(html);
out.document.close();
}
else if(IE4){
out = document.frames ? document.frames[name] : document.all[name];
out.innerHTML=html;
}
else if(DOM){
out = document.getElementById(name);
out.innerHTML=html;
}
}
///////////////////////////////////////

This code seems well able to write lumps of HTML into the document
at specified div's etc etc and the appearance of the page changes.
Any <a tags> in the dynamically changed section seem to work.

However, if the written html contains for variables eg
<input type="checkbox" name="cb0"> then the form into which the
html is written doesn't seem to see the new inputs.

This code works well in IE5,6 Mozilla etc so what does Mac IE 5 need me
to do?

Robin Becker

--
Robin Becker

[Robert]

The code that does the writing looks like
///////////////////////////////////////
var IE4 = document.all ? 1 : 0;
var NS4 = document.layers ? 1 : 0;
var DOM = (!IE4 && document.getElementById) ? 1 : 0;

function wlayer(name,html){
var out;
if(NS4){
out = document.layers[name];
out.document.open();
out.document.write(html);
out.document.close();
}
else if(IE4){
out = document.frames ? document.frames[name] : document.all[name];
out.innerHTML=html;
}
else if(DOM){
out = document.getElementById(name);
out.innerHTML=html;
}
}

Why don't you try the DOM path by putting the DOM test before the IE4
test? Doesn't your code in IE5 and IE6 take the IE4 path because
document.all still exists?

Robert

[Michael Winter]

On Wed, 07 Apr 2004 14:39:50 +0100, Robin Becker <ro***@reportlab.com>
wrote:

I'm trying to fix a problem in IE 5.2 javascript on mac OS 10.2.

Basically the problem is that we're writing dynamic form elements and
these don't seem to be recognized by the form.
[snipped nasty script]

I suggest you read:

<URL:http://jibbering.com/faq/#FAQ4_26>

and its links.
This code seems well able to write lumps of HTML into the document
at specified div's etc etc and the appearance of the page changes.
Any <a tags> in the dynamically changed section seem to work.

However, if the written html contains for variables eg
<input type="checkbox" name="cb0"> then the form into which the
html is written doesn't seem to see the new inputs.

Also read:

<URL:http://jibbering.com/faq/#FAQ4_15>

and its links.

Mike

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)

[Robin Becker]

Michael Winter wrote:

On Wed, 07 Apr 2004 14:39:50 +0100, Robin Becker <ro***@reportlab.com>
wrote:

I'm trying to fix a problem in IE 5.2 javascript on mac OS 10.2.

Basically the problem is that we're writing dynamic form elements and
these don't seem to be recognized by the form.

[snipped nasty script]

I suggest you read:

<URL:http://jibbering.com/faq/#FAQ4_26>

and its links.

This code seems well able to write lumps of HTML into the document
at specified div's etc etc and the appearance of the page changes.
Any <a tags> in the dynamically changed section seem to work.

However, if the written html contains for variables eg
<input type="checkbox" name="cb0"> then the form into which the
html is written doesn't seem to see the new inputs.

Also read:

<URL:http://jibbering.com/faq/#FAQ4_15>

and its links.

Mike

Unfortunately I don't think it's the nasty code that's wrong.

I wrote this based on the jibbering stuff and it still fails (in OS X IE 5.2)
to submit the added checkbox when submit is pressed. In Mac IE5.2
the checkbox appears and can be checked and unchecked, but it does not
appear in the list of form fields when testmyForm is hit.

Seems to work fine in other browsers.

<html>
<head>
<script lang="javascript">
<!--
var getElementWithId=
document.getElementById
?function(id){return document.getElementById(id);}
:document.all
?function(id){return document.all[id];}
:function(id){return null;};
var DynWrite=function(id, S){
var testH, newH, inH, testID;
var funcBody = "return false;"
var el = getElementWithId(id);
if((el)&&(typeof el.innerHTML == 'string')){
testID = "tSt";
while(getElementWithId(testID)){
testID += testID;
}
inH = el.innerHTML;
newH = inH+"<sTrOnG Id='"+testID+"' >test<\/StRoNg >";
el.innerHTML = newH;
testH = el.innerHTML;
if((testH != newH)&&
(testH != inH)&&
(getElementWithId(testID))){
funcBody = "getElementWithId(id).innerHTML=S;return true";
}
}
DynWrite = new Function("id", "S", funcBody);
return DynWrite(id, S);
}
//-->
</script>
<script lang="javascript">
<!--
function dw0(){
return DynWrite('placeHolder','<input type="checkbox" name="bingo">');
}
function dw1(){
return DynWrite('anID','new<code>HTML</code>');
}
function testMyForm(t){
var f=t.form, i, s='';
for(i=0;i<f.elements.length;i++){
s += 'element['+i+'].name='+f.elements[i].name+'\n';
}
alert('Form\n'+s);
}

//-->
</script>
</head>
<body>
<form action="formecho.cgi" method="POST">
<a href="javascript:;" onmouseup="dw0()">dw0</a>
<a href="javascript:;" onmouseup="dw1()">dw1</a>
<div id="placeHolder">old</div>
<div ID="anID">old <code>HTML</code></div>
<input type=button name="test" value="testMyForm" onclick="testMyForm(this)">
<input type=submit name="submit" value="Submit">
</form>
</body>
</html>
--
Robin Becker

[Richard Cornford]

Robin Becker wrote:
<snip>

I wrote this based on the jibbering stuff and it still fails
(in OS X IE 5.2) to submit the added checkbox when submit is
pressed. In Mac IE5.2
the checkbox appears and can be checked and unchecked, but it
does not appear in the list of form fields when testmyForm is hit.

Seems to work fine in other browsers.

<html>
<head>
<script lang="javascript">
Formally correct (valid) HTML 4 requires the TYPE attribute in the
opening script tag, and once used the (deprecated) LANGUAGE attribute is
redundant.

<script type="text/javascript">
<!-- <snip> //-->
The "hiding from older browsers" HTML comment-like tags in javascript
source code are now an anachronism as those "older" browsers are so old
that they are no longer in use.
</script>
</head>
<body>
<form action="formecho.cgi" method="POST">
<a href="javascript:;" onmouseup="dw0()">dw0</a>
<a href="javascript:;" onmouseup="dw1()">dw1</a>

<snip>

Using "javascript:" in a HREF is a known causer of problems on various
browsers (and particularly little-tested browsers on unusual OSs, which
Mac IE is). And that particular formulation - javascirpt:; - is
demonstrated to produce a (usually internally suppressed) syntax error
on Windows IE (at least it can be demonstrated on IE <= 5.0).

Basically, in cross-browser scripting terms, once a javascript HREF has
been acted upon all bets on what the browser will subsequently
support/do are off.

It might be that Mac IE 5 just will not recognise dynamically added
checkboxes, but nothing is proven one way or another until the
javascirpt: HREFs are gone. Try triggering the action form <input
type="button"> elements instead (or, at minimum, adding onclick="return
false;" event handlers to the links to cancel the navigation and prevent
the HREFs being acted upon).

Richard.

[Robin Becker]

Richard Cornford wrote:

...... tips elided

</script>
</head>
<body>
<form action="formecho.cgi" method="POST">
<a href="javascript:;" onmouseup="dw0()">dw0</a>
<a href="javascript:;" onmouseup="dw1()">dw1</a>

<snip>

Using "javascript:" in a HREF is a known causer of problems on various
browsers (and particularly little-tested browsers on unusual OSs, which
Mac IE is). And that particular formulation - javascirpt:; - is
demonstrated to produce a (usually internally suppressed) syntax error
on Windows IE (at least it can be demonstrated on IE <= 5.0).

Basically, in cross-browser scripting terms, once a javascript HREF has
been acted upon all bets on what the browser will subsequently
support/do are off.

It might be that Mac IE 5 just will not recognise dynamically added
checkboxes, but nothing is proven one way or another until the
javascirpt: HREFs are gone. Try triggering the action form <input
type="button"> elements instead (or, at minimum, adding onclick="return
false;" event handlers to the links to cancel the navigation and prevent
the HREFs being acted upon).

Richard.

I tried this instead
<div style="color: blue" onmouseup="dw0()">dw0</div>
once again this creates the checkbox in the browser window at
the right place, but the form doesn't contain any extra elements.

I can only assume that I need to do something extra. I added an id
on the checkbox and can tell that an object is being created.

the overall script is now
<html>
<head>
<script type="text/javascript">
var getElementWithId=
document.getElementById
?function(id){return document.getElementById(id);}
:document.all
?function(id){return document.all[id];}
:function(id){return null;};
function DynWrite(id, S){
var testH, newH, inH, testID;
var funcBody = "return false;"
var el = getElementWithId(id);
if((el)&&(typeof el.innerHTML == 'string')){
testID = "tSt";
while(getElementWithId(testID)){
testID += testID;
}
inH = el.innerHTML;
newH = inH+"<sTrOnG Id='"+testID+"' >test<\/StRoNg >";
el.innerHTML = newH;
testH = el.innerHTML;
if((testH != newH)&&
(testH != inH)&&
(getElementWithId(testID))){
funcBody = "getElementWithId(id).innerHTML=S;return true";
}
}
DynWrite = new Function("id", "S", funcBody);
return DynWrite(id, S);
}
</script>
<script type="text/javascript">
function dw0(){
return DynWrite('placeHolder','<input type="checkbox" name="bingo"
id="bingo">');
}
function dw1(){
return DynWrite('anID','new<code>HTML</code>');
}
function testMyForm(t){
var f=t.form, i, s='';
for(i=0;i<f.elements.length;i++){
s += 'element['+i+'].name='+f.elements[i].name+'\n';
}
s += 'Elements\nbingo='+getElementWithId('bingo')+'\n';
alert('Form\n'+s);
}
</script>
</head>
<body>
<form action="formecho.cgi" method="POST">
<div style="color: blue" onmouseup="dw0()">dw0</div>
<div style="color: blue" onmouseup="dw1()">dw1</div>
<div id="placeHolder">old</div>
<div ID="anID">old <code>HTML</code></div>
<input type=button name="test" value="testMyForm" onclick="testMyForm(this)">
<input type=submit name="submit" value="Submit">
</form>
</body>
</html>
--
Robin Becker