disabling form elements in IE

[omidmottaghi]

I need to disable/enable form elements in my form.
the code i was developed works fine in FF, but in IE, its behaviour is
very strange!!

in the form, we have a lot of checkboxes, all of them named like
"xyz_np".
in front of each checkbox, we have some fields, named "xyz"

this is my JS code.
after clicking on checkboxes:
======================================
function clicked(me, objNames){
obj = findObj(me);
for(i = 0; i < objNames.length; i++){
obj1 = findObj(objNames);
if(obj.checked==true){
obj1.disabled = false;
obj1.style.border = "1px solid #000";
obj1.style.color = "#000000";
}else{
obj1.disabled = true;
obj1.style.border = "1px solid lightgray";
obj1.style.color = "gray";
}
}
}
=======================================
at startup, on body onload event:
=======================================
function start(){
obj = findObj("search");
for(i = 0; i < obj.elements.length; i++){
if(obj.elements.name.indexOf('_np')==-1 &&
obj.elements.name.indexOf('submit')==-1){
obj.elements.disabled = true;
obj.elements.style.border = "1px solid lightgray";
obj.elements.style.color = "gray";
}
}
}

NOTE: findObj() is Macromedia findObj function. it should return an
element resource.

this code, in IE, cannot disable a field **UNTIL** you typed some
characters in that field, before disabling!!!!

i used FF1.5b2 and IE6SP1.

 

[Thomas 'PointedEars' Lahn]

function clicked(me, objNames){
obj = findObj(me);
for(i = 0; i < objNames.length; i++){

Better (because of the declaration) and more efficient (because of the
decrement) is

for (var i = objNames.length; i--
{

You also want to test whether findObj() [or its equivalent] returned
a reference to an appropriate object before you apply the property
accessor syntax to that value. That would be at least

var obj = ...;
if (obj)
{
...
}

obj1 = findObj(objNames);
if(obj.checked==true){
obj1.disabled = false;

Same here.

obj1.style.border = "1px solid #000";
obj1.style.color = "#000000";

Why not be consequent (in supporting low color depths) and write

obj1.style.color = "#000";

instead?

[...]
function start(){
obj = findObj("search");
for(i = 0; i < obj.elements.length; i++){

See above.

if(obj.elements.name.indexOf('_np')==-1 &&
obj.elements.name.indexOf('submit')==-1){

Such unnecessary applications of the property accessor syntax
(short and informal: "lookup operations") should be avoided:

for (var el = obj.elements, i = el.length; i--
{
var o = el;
if (o.name
&& o.name.indexOf('_np') == -1
&& o.name.indexOf('submit') == -1)
{
// contains references to o
}
}

obj.elements.disabled = true;

Try

if (!(o.disabled = true))
{
o.disabled = "disabled";
}

obj.elements.style.border = "1px solid lightgray";
obj.elements.style.color = "gray";

You may be looking for `backgroundColor', not `color'. Furthermore, you
probably want to set both `color' and `backgroundColor' at the same time:

[...]
NOTE: findObj() is Macromedia findObj function. it should return an
element resource.

It should not be used at all. The last time I checked, like
any of Macromedia's JS code I have seen to date, it was junk.

this code, in IE, cannot disable a field **UNTIL** you typed some
characters in that field, before disabling!!!!

If that is true and cannot be blamed on any line of code you used, then it
is an IE bug and you cannot do anything about it (except work around it or
not recommend [this specific] IE [version] for use).

i used FF1.5b2 and IE6SP1.

PointedEars

P.S.: Do not use tabs for indentation, use spaces.
P.P.S.: Your Exclamation Mark key appears to be broken.

 

[omidmottaghi]

Thanks PointedEars

the last code i used is, before your reply:
===========================
function findObj(theObj)
{
return foundObj = document.getElementById(theObj);
}

function clicked(me, objNames){
obj = findObj(me);
for(i = 0; i < objNames.length; i++){
obj1 = findObj(objNames);
if(obj.checked==true){
obj1.disabled = false;
obj1.style.color = "#000";
obj1.style.backgroundColor = "#fff";

}else{
obj1.disabled = true;
obj1.style.color = "#888";
obj1.style.backgroundColor = "#EEE";
}
}
}

function start(){
obj = findObj("search");
for(i = 0; i < obj.elements.length; i++){
if(obj.elements.name.indexOf('_np')==-1 &&
obj.elements.name.indexOf('submit')==-1){
obj.elements.disabled = true;
}
}
}
===========================

and this code works fine in IE! (not enough fine as it must!)
but i forced to add css styles in tags, instead of javascript, because
IE first do JS, then apply CSS settings except ONLY FIRST field.

i think i should remove "start()" function at all and add
"disabled="disabled"" to each tag.

AND i will add some of your NICE sugestions

Thanks, Omid

P.S.S: no

 

[Thomas 'PointedEars' Lahn]

the last code i used is, before your reply:
===========================
function findObj(theObj)
{
return foundObj = document.getElementById(theObj);
}

That method is entirely redundant. It would only not be if it included
the required feature test for the implementation of the used DOM Level 2
method. The assignment to `foundObj' is, if `foundObj' is even accessed
outside of the method, bad style: it defines, but not declares, a new
global variable from local scope.

So it should read more like:

function findObj(theObj)
{
var t;
if ((t = typeof document.getElementById) == "function"
|| t == "object" && document.getElementById)
{
return document.getElementById(theObj);
}

return null;
}

the return value of this method would have to be evaluated (instead of
using `foundObj') after calling it then.

and this code works fine in IE! (not enough fine as it must!)

*Maybe*. How many different IE versions on how many different
platforms and operating systems have you tested with?

but i forced to add css styles in tags, instead of javascript, because
IE first do JS, then apply CSS settings except ONLY FIRST field.

Are you sure about that and that you really understood how the CSS cascade
works?

i think i should remove "start()" function at all and add
"disabled="disabled"" to each tag.

I think you should consume more tea[tm] before you start coding.

AND i will add some of your NICE sugestions

PointedEars

 

[omidmottaghi]

Thanks, i will fix findObj later.

*Maybe*. How many different IE versions on how many different
platforms and operating systems have you tested with?

Maybe
i tested it with 2-3 IE versions.

Are you sure about that and that you really understood how the CSS cascade
works?

yes, as i told, i have a lot of fields, all of them had same CSS code
and same JS code. but JS code ONLY applied to first field and CSS code
applied to other fields. (be sure im right )

Thanks again PointerEars