Help with Passing an object to SetTimeOut function

Discussion in 'Javascript' started by Ken, Oct 6, 2004.

  1. Ken

    Ken Guest

    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
    Ken, Oct 6, 2004
    #1
    1. Advertising

  2. Ken

    Agent Smith Guest

    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
    Agent Smith, Oct 7, 2004
    #2
    1. Advertising

  3. Ken

    Ken Guest

    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




    *** Sent via Developersdex http://www.developersdex.com ***
    Don't just participate in USENET...get rewarded for it!
    Ken, Oct 7, 2004
    #3
  4. On 6 Oct 2004 08:39:28 -0700, Ken <> wrote:

    > 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.

    <script type="text/javascript">

    > <!--


    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
    Replace ".invalid" with ".uk" to reply by e-mail.
    Michael Winter, Oct 7, 2004
    #4
  5. On 07 Oct 2004 09:49:23 GMT, Ken <> wrote:

    > 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

    --
    Michael Winter
    Replace ".invalid" with ".uk" to reply by e-mail.
    Michael Winter, Oct 7, 2004
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. James Vanns
    Replies:
    7
    Views:
    7,011
    Evan Carew
    Jan 21, 2004
  2. Replies:
    3
    Views:
    4,702
    Diez B. Roggisch
    Jun 12, 2006
  3. Raphael Bauduin

    setTimeout and passing argument

    Raphael Bauduin, Nov 5, 2003, in forum: Javascript
    Replies:
    4
    Views:
    132
    Rich Persaud
    Nov 7, 2003
  4. Telmo Costa

    Object this and setTimeout

    Telmo Costa, Feb 21, 2006, in forum: Javascript
    Replies:
    3
    Views:
    85
    Thomas 'PointedEars' Lahn
    Feb 22, 2006
  5. Andrew Poulos

    setTimeout and an object's methods

    Andrew Poulos, Mar 5, 2006, in forum: Javascript
    Replies:
    12
    Views:
    221
    Dr John Stockton
    Mar 13, 2006
Loading...

Share This Page