#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12

    Of Javascript, Mozilla/Netscape, and tables


    I'm relatively new to Javascript and consistently avoid Netscape & Mozilla in order to maintain a pleasantly high quality of life. However, inasmuch as I need my apps to run for Netscape-types as well as us IE people, I have to deal with issues such as this one. I am trying to us javascript to change the background color of a table. This works fine in IE with the following statement:

    var tableColor=field+'.bgColor=\'' + color + '\'';
    eval(tableColor);

    "field" is a variable containing the name of the table. As I said, IE has no problem with this. Netscape and Mozilla, however, have a rather substantial problem with it.

    PLEASE help! I can't afford to spend anymore time on this!

    Thanks,
    Tim
  2. #2
  3. mod_dev_shed
    Devshed Supreme Being (6500+ posts)

    Join Date
    Sep 2002
    Location
    Atlanta, GA
    Posts
    14,817
    Rep Power
    1099
    Netscape and Mozilla, however, have a rather substantial problem with it.
    And what would that problem be? Do you get an error? or does the background color just not change? Try this:
    Code:
    var tableColor = field+'.style.backgroundColor="'+color+'"';
    eval(tableColor);
    Another solution is to use getElementByID(). Look that one up; it'll save you some trouble.
    # Jeremy

    Explain your problem instead of asking how to do what you decided was the solution.
  4. #3
  5. |<.+#f@#+.&.|
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Mar 2002
    Location
    norway
    Posts
    3,009
    Rep Power
    1224
    I'm relatively new to Javascript and consistently avoid Netscape & Mozilla in order to maintain a pleasantly high quality of life.

    if you still are new, wouldn't it be better to learn the proper standards first
    http://www.w3.org/DOM/DOMTR
    before you begining to bash browsers.
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Sep 2000
    Posts
    763
    Rep Power
    0
    Thats right Mozilla is easier to program for as it follows the standards. It does not require silly hacks just to make things work right.
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12

    Good grief!


    Guys, whoa! Sorry to step on any toes, I was just trying to add a little humor into the often stale computing world. I was merely poking fun at a program while ironically admitting my ignorance regarding it.

    It was a joke about a web browser--not your mom. Please forgive me if I have offended people in any way by making light of an inanimate collection of 0s and 1s. I welcome retribution--you may mock Internet Explorer to your hearts' content.

    Laugh a little--it's therapeutic.

    t
  10. #6
  11. mod_dev_shed
    Devshed Supreme Being (6500+ posts)

    Join Date
    Sep 2002
    Location
    Atlanta, GA
    Posts
    14,817
    Rep Power
    1099
    Laugh a little--it's therapeutic.
    Spongebob's always smiling!

    I think the point was that you won't have problems like this if you learn to code for a browser other than IE. IE code works great in IE, but nothing else. Standards code works in IE (usually, or maybe with a little hack here and there -- blame M$), AND most everything else.

    Did you get it working?
    # Jeremy

    Explain your problem instead of asking how to do what you decided was the solution.
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12

    Spongebob is my hero


    Not sure if it's working yet--I'll find out on Monday when I head back to work (actually it's far more likely that I'll find out once I get there, rather than while en route.) Anyhow, I'm new to coding anything for any browser. I've had to learn CSS, Javascript, and PHP in a week and a half so it's been a trying feat to say the least. I greatly appreicate everyone's help, and consequently I shall attempt to tread more lightly on this new turf.

    Thanks again,
    t

    Also, Spongebob is joy.
  14. #8
  15. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12
    Both of the following lines work in IE but neither works in Mozilla.

    var tableColor = field+'.style.backgroundColor=\"'+color+'\"';
    or
    var tableColor=field+'.bgColor=\'' + color + '\'';

    Mozilla's Javascript console tells me that the fields being referenced by the "field" variable is not defined. This is not good, especially seeing as it is defined by an id= statement. Does it need to be preceeded in the Javascript by the form name in which the field is nested?

    Thanks,
    t
  16. #9
  17. mod_dev_shed
    Devshed Supreme Being (6500+ posts)

    Join Date
    Sep 2002
    Location
    Atlanta, GA
    Posts
    14,817
    Rep Power
    1099
    You do have to properly assign the value to field; you never showed us how you were doing that.
    Code:
    <script language="javascript">
    function changeFoo()
      {
      document.getElementById('foo').style.backgroundColor='#0000FF';
      }
    </script>
    <table id="foo" style="background-color:#FF0000">
      <tr>
        <td>FooBar</td>
      </tr>
    </table>
    <form>
    <input type="button" value="Change Table Color" onclick="javascript:changeFoo();">
    </form>
    # Jeremy

    Explain your problem instead of asking how to do what you decided was the solution.
  18. #10
  19. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12
    As I previously stated (and I stand by this 100%), Spongebob is my hero. Your revisions worked, thank you ever so much! My problem was primarily in the manner in which the table background color was set in the HTML. My only problem now is that it bombs out Mozilla after a few times changing the table's color. The worst part is that there seems to be no pattern to the crash. On top of this, the Javascript console shows no errors prior to the crashes (of course it closes as soon as Mozilla bombs).
    Maybe the problem is (again) with my HTML. Here is the relevant Javascript:

    function doIt(color)
    {
    var field=document.getElementById('fieldInfo').value;
    var form=document.getElementById('formInfo').value;

    // Set the hidden field to contain the color name in the following format: fieldname_Value
    eval('document.'+form+'.'+field+'_Value.value=\'' + color + '\'');

    // Get the selected color and set the table's background color equal to it
    document.getElementById(field).style.backgroundColor=color;
    }


    I apologize for the escape characters--this is nested in a PHP file.
    Anyhow, here is a bit of the relevant HTML:


    <table bgcolor=\"#FFFFFF\" width=\"20\" height=\"20\" id=\"bgcolor\" name=\"bgcolor\" border=2 bordercolor=\"#000000\" style=\"background-color:#FFFFFF\">
    <tbody><tr><td></td></tr></tbody>
    </table>
    </td>
    <td>
    <input type=\"button\" name=\"backClr\" value=\"Choose Color\" onclick=\"NewWindow('webEdit','bgcolor');return false\" style=\"font-size:12\">
    <input type=\"hidden\" name=\"bgcolor_Value\" id=\"bgcolor_Value\" value=\"$bgcolor\">


    The parameters being passed are, respectively, the form name and the name of the table whose color we are changing. As always, my brain struggles so any help garners unquantifiable gratitude.

    Thanks,
    t
  20. #11
  21. mod_dev_shed
    Devshed Supreme Being (6500+ posts)

    Join Date
    Sep 2002
    Location
    Atlanta, GA
    Posts
    14,817
    Rep Power
    1099
    I don't think that's the relevant HTML. I only see a call to the function NewWindow(), which takes two parameters, and the function you show is called doIt() and takes one.
    # Jeremy

    Explain your problem instead of asking how to do what you decided was the solution.
  22. #12
  23. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12
    Sorry.

    I should have explained that while it calls a function named "NewWindow()", NewWindow does a few things and then passes the color to the doIt() function. The other Javascript in NewWindow() doesn't directly pertain to this color change problem so I excluded it (that and the fact that it's both lengthy, poorly commented, and ugly).

    NewWindow() takes the name of the form and the table name and places those values into two hidden fields which are retrieved in the doIt() function.

    Again, sorry for the confusion. I will strike myself for such foolishness.

    t
  24. #13
  25. mod_dev_shed
    Devshed Supreme Being (6500+ posts)

    Join Date
    Sep 2002
    Location
    Atlanta, GA
    Posts
    14,817
    Rep Power
    1099
    Do you need to set the color to a hidden field? It seems like you might have some things going on that are unecessary, but you'll have to decide that based on the entire application.

    I think form is a reserved word and you shouldn't use it as a variable name.
    # Jeremy

    Explain your problem instead of asking how to do what you decided was the solution.
  26. #14
  27. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12
    Yes, the color value is stored in another hidden field - one hidden field for each table whose color I am changing. Basically, the table is a small 20x20 square which serves as a color chip. Users can click a button, choose a certain color from a popup window and the color chip changes to reflect their choice. Without segue he said...in accordance with your suggestion, I have changed the "form" variable name to "frm" so as to avoid any potential conflicts with reserved words, Mozilla, however, still has some kind of problem that causes it to crash--this happens in Win2k and Red Hat alike. I'm afriad I'll have to simply forego using this table feature in Mozilla and make it an IE-only function. If you can think of anything else, though, you are, of course, welcome to pass along your thoughts.

    Thanks again for all your patience and assistance,
    t
  28. #15
  29. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2003
    Posts
    84
    Rep Power
    12

    Lightbulb Ah ha!


    Turns out that the crashing is unique to Mozilla (and platform independant). Apparently, Javascript popup windows cause this problem--we have experienced the same trouble with other applets (which I didn't write). The above script works in Pheonix (the new Mozilla) and all other major browsers we've tried.

    Thanks everyone for your help, especially jharnois who has gone out of his way to help me time and time again,

    t

IMN logo majestic logo threadwatch logo seochat tools logo