Help with Passing an object to SetTimeOut function

[Ken]

Hello

I am trying to change the color of a font in a text box.

I have been reading about and trying various examples found it this
group, but still can't get it right.

Here is where I am now:

<script language="JavaScript">
<!--
function spin(fillin,count)
{
var intVal;
setcolor(fillin,"#fff000"); // works fine

// but keep getting object expected error
setTimeOut('setcolor(' + fillin + ',"#000fff");',1000);

intVal = eval(fillin.value) + eval(count);
if (intVal < 0) intVal = 0;
if (intVal > 999) intVal = 1000;
fillin.value = intVal;
return 0;
}
<!--
function setcolor(fldname,clrcode)
{
fldname.style.color = clrcode;
return 0;
}
//-->
</script>

I've tried various methods to get around this, but I think I need to
be able to pass the object, not the name. Ideas tried:

called setTimeOut('setcolor(' + fillin.name + ',"#000fff");',1000);
and tried getObjectByName - no good, at least
Document.getobjectbyname(flname).style.color was invalid...

set fstring = 'setcolor(' + fillin + ',"#000fff");' and called
setTimeOut(fstring,1000) but this didn't cut either.

Any advice, redirection or other instructions will be appreciated.

Thanks
Ken

 

[Agent Smith]

Alright let's see if I can help...

setTimeOut('setcolor(' + fillin + ',"#000fff");',1000);

Well the problem is what you want is to pass the object reference (fillin)
to the setcolor method, but instead this code is coverting the object
reference to a string (prob looks like [object, object] or something. And of
course there are no attributes on a string so the setcolor method blows up
when it tries to find a style attribute on this goofy string.

Anyway to fix the problem I suggest the following based on the code you
wrote. There are prob a hundred other variations.

setTimeout('setcolor(' + fillin.id + ',"#000fff");',1000);

function setcolor(id, clrcolor){
document.getElementById(id).style.color = clrcolor;
}

Note you may need to set an id value for the input field if it doesn't
already have one.

Regards
Mike

 

[Ken]

Thanks for that Mike,

I added id's to the input field (eg. id="1") but get a "Object doesn't
support this property or method" error.

This by itself doesn't work:

document.getElementByID(fillin.id).style.color = "#BCBCBC";

Thanks
Ken

 

[Michael Winter]

Hello

I am trying to change the color of a font in a text box.

I have been reading about and trying various examples found it this
group, but still can't get it right.

Here is where I am now:

<script language="JavaScript">

Don't use the language attribute. Not only is it deprecated, but the
required type attribute makes it redundant.

<!--

Similarly, hiding script contents is an out-dated practice. Remove the
SGML comment delimiters.

function spin(fillin,count)
{
var intVal;
setcolor(fillin,"#fff000"); // works fine
// but keep getting object expected error
setTimeOut('setcolor(' + fillin + ',"#000fff");',1000);

As the other Mike pointed out, this will produce something like

setTimeOut('setcolor([Object],"#000fff");',1000);

though the precise text between the square brackets will vary by browser.
This is because the string concatenation you perform calls the toString
method of the object which returns, by default, [Object <class name>].
Although you were given one approach, there is another: a closure.

When you place a function within another function, you are able to
reference variables in the outer function, even once the outer function
has returned. As long as the inner function survives somehow, the
variables it references will also survive with their values intact.

setTimeout(function() { // Note the case of setTimeout!
setcolor(fillin, '#000fff');
}, 1000);

The function expression is an inner function of your spin function,
referencing the argument, fillin. Because the setTimeout function retains
this inner function, the survival requirement I mentioned above is met.

There is a problem with this, however. Some older browsers are unable to
accept a function reference as an argument to setTimeout. With a
modification to the code already presented to you, you can use a
string-based call to setTimeout:

function setColor(obj, clr) {
if('object' == typeof obj.style) {obj = obj.style;}
obj.color = clr;
}
setColor.fromForm = function(form, name, clr) {
setColor(document.forms[form].elements[name], clr);
};

setTimeout('setColor.fromForm(' + fillin.form.id
+ ',' + fillin.id + ', "#000fff"', 1000);

replacing .id with .name as long as the names to be used are unique.
Of course, old browsers (IE4/NN4/Opera 5, etc) might not be an issue for
you, in which case feel free to use the much cleaner first version.

intVal = eval(fillin.value) + eval(count);

Don't use eval, especially on user inputs. In this case, it's just a
kludge.

To coerce a string to a number, you can use unary plus (the parentheses
are just for clarity):

intVal = (+fillin.value) + (+count);

Of course, you should ensure that the user has actually entered a number,
first.

if (intVal < 0) intVal = 0;
if (intVal > 999) intVal = 1000;
fillin.value = intVal;
return 0;
}
<!--
function setcolor(fldname,clrcode)
{
fldname.style.color = clrcode;
return 0;
}

Why are you returning zero from both functions? Granted, you haven't shown
all your code, but I doubt any return values are necessary.

[snip]

and tried getObjectByName - no good, at least
Document.getobjectbyname(flname).style.color was invalid...

There is no such method, getObjectByName, on the document object. There's
getElementById, and getElementByName, but they aren't necessary. Also,
watch the case of identifiers. Javascript is case-sensitive, and document
is all lowercase.

[snip]

Hope that helps,
Mike

 

[Michael Winter]

I added id's to the input field (eg. id="1") but get a "Object doesn't
support this property or method" error.

For one thing, id attribute values must start with a letter.

This by itself doesn't work:

document.getElementByID(fillin.id).style.color = "#BCBCBC";

For another, the "d" in getElementById must be lowercase. However, please
read my other reply in this thread (if you haven't, already).

[snip]

Mike