Well, it's really sad. getElementById is not supported by Pocket IE.
I've read it'll be there with Microsoft Windows Mobile 5.0. But all our
devices are using Windows Mobile 3.0 and even may not be upgradable.
Changing Robs code I've found another annoying difference. onclick is
not executed on <P>. It looks like <a>, <form> or a form element
<input>,.. is required to get an onclick event.
The most annoying part is the acceptance of the display style attribute
at loading time. Setting it in the html source to none will hide the
element(s). Not using or setting it to something else will display the
element(s) as expected. It looks like there is a switch anywhere else.
Any idea? Sorry the following example code now gets large.
TIA
Stefan
<script type="text/javascript">
function ev_toggle_display(name) {
el = ev_getElementByName(name);
// looking at element
// alert (el);
// returns: [object]
// alert (el.style);
// returns nothing (=undefined?)
// alert (el.style.display);
// returns Microsoft JScript runtime error
// line: # character: #
// Error 'el.style.display' is null or not an object
// Source: (null)
// looking at document
// alert (document);
// returns: [object]
// alert (document.all);
// returns nothing (=undefined?)
// alert (document.all.data);
// returns Microsoft JScript runtime error
// line: # character: #
// Error 'document.all.data' is null or not an object
// Source: (null)
// alert (document.forms);
// returns: [object]
//alert (document.forms[0].data);
// returns: [object]
// alert (document.forms[0].data.style);
// returns nothing (=undefined?)
if (el.style.display == 'none') {
el.style.display = '';
} else {
el.style.display = 'none'
}
}
function ev_getElementByName(elName) {
// all elements ID and NAME are kept the same and unique
var el = null;
if (document.getElementById) {
el = document.getElementById(elName);
} else {
// Pocket IE: getElementById is not available
// Walk through all forms and elements
for (var j=0; j<document.forms.length; j++) {
if (document.forms[j].name == elName) {
el = document.forms[j];
break;
}
for (var i=0;i<document.forms[j].elements.length;i++) {
if (document.forms[j].elements[i].name == elName) {
el = document.forms[j].elements[i];
break;
}
}
}
}
return el;
}
</script>
<FORM ACTION="#">
<INPUT ONCLICK="javascript
:ev_toggle_display('data');retu rn false;"
TYPE="SUBMIT" VALUE="Click here to display more or less data">
<INPUT ID="data" NAME="data" STYLE="display:none;" TYPE="TEXT"
VALUE="More data.">
</FORM>
As before. The code is working on IE5+/6, NS, Moz, FF, Galeon, Konqueror.
RobG wrote:
<script type="text/javascript">
function showHide(id)
{
if(document.getElementById) {
var el = document.getElementById(id);
}
if (el && el.style){
el.style.display = ('none' == el.style.display)? '' : 'none';
}
}
</script>
<p onclick="showHide('data');">
Click here to display more or less data:</p>
<p id="data">More data.</p>