Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 22
  1. #1
    New to the CF scene
    Join Date
    Jun 2003
    Location
    Australia
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry how do i reference a specific cell in a table

    i have a call <BODY onLoad=changeColor()>

    a table definition

    <TABLE name="table1">
    <TR name="row1">
    <TD name="cell1">rah rah</TD>
    </TR>
    </TABLE>

    the function changeColor starts a timer and then every ten seconds i want to change the background color using the reference

    table1.row1.cell1.bgcolor="blue";

    i have also tried

    table1.row1.cell1.style.bgcolor="blue";

    i keep getting table1.row1.cell1 is null or not an object

    i would also like to change the color of a font
    <FONT name="font1"> while i am at it

    any help greatly appreciated

    Thanks

    hughman

  • #2
    Regular Coder
    Join Date
    Jul 2002
    Posts
    698
    Thanks
    0
    Thanked 0 Times in 0 Posts
    try

    document.all.table1.row1.cell1

  • #3
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts

    Lightbulb

    try using "id" instead of "name" so you can use the getElementById method. (for IE6> and NS6>)

    function objectSetup() {
    zcell1 = new layerSetup("cell1","blue");
    function layerSetup(id,color) {
    this.obj = document.getElementById(id).style;
    this.obj.bgColor = bgcolor;
    return this.obj;
    }


    iar in <body onload=objectSetup()>

    and the table shoul look like:
    <TABLE>
    <TR>
    <TD id="cell1">rah rah</TD>
    </TR>
    </TABLE>

    Now you can create a change function such as

    function change() {
    zcell1.bgcolor = "red";
    }

    ... and start it with an event, whichever.

    Furthermore, u can make it cross-browser, something like:

    //a browser detect such as:
    function Este() {
    agent = navigator.userAgent.toLowerCase();
    this.major = parseInt(navigator.appVersion);
    this.minor = parseFloat(navigator.appVersion);
    this.ns = ((agent.indexOf('mozilla') != -1) && ((agent.indexOf('spoofer') == -1) && (agent.indexOf('compatible') == -1)));
    this.ns2 = (this.ns && (this.major == 3));
    this.ns3 = (this.ns && (this.major == 3));
    this.ns4b = (this.ns && (this.major == 4) && (this.minor <= 4.03));
    this.ns4 = (this.ns && (this.major == 4));
    this.ns6 = (this.ns && (this.major >= 5));
    this.ie = (agent.indexOf("msie") != -1);
    this.ie3 = (this.ie && (this.major < 4));
    this.ie4 = (this.ie && (this.major == 4) && (agent.indexOf("msie 5.0") == -1));
    this.ie5 = (this.ie && (this.major == 4) && (agent.indexOf("msie 5.0") != -1));
    this.ie55 = (this.ie && (this.major == 4) && (agent.indexOf("msie 5.5") != -1));
    this.ie6 = (this.ie && (agent.indexOf("msie 6.0")!=-1) );

    }
    var este = new Este();

    //than the two setup functions, cross-browsered this time:

    function objectSetup() {
    zcell1 = new layerSetup("cell1","blue");
    function layerSetup(id,color) {
    if (este.ie5||este.ie55||este.ie6||este.ns6){
    this.obj = document.getElementById(id).style;
    this.obj.bgColor = bgcolor;
    return this.obj;
    } else if(este.ie4) {
    this.obj = document.all[id].style;
    this.obj.bgColor = bgcolor;
    return this.obj;
    } else if(este.ns4) {
    this.obj = document.layers[id];
    this.obj.bgColor = bgcolor;
    return this.obj;
    }
    }

    You can now play with that color building new functions which can change it whenever a event. You may insert all the style's atributes, such as position (doing even moving functions) or visibility.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #4
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts

    sorry

    i forgot to close the } function
    so that will be

    function objectSetup() {
    zcell1 = new layerSetup("cell1","blue");
    }
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #5
    New to the CF scene
    Join Date
    Jun 2003
    Location
    Australia
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile Thanks problem solved

    Thank you both for your help

    I did end up using id instead of name

    I passed the id to the method and then referenced it using

    document.all[id].bgColor=color;

    this worked straight away and has saved the rest of my hair from being pulled

    I will mess around for a while and try to understand your solution Kor as it is probably a better way than mine

    Thanks

    hughman

  • #6
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    ok... i've send u the entire cross-browser solution, becouse u can use document.all[id] only for IE, but not for NS who recognize document.layers[id].
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #7
    New to the CF scene
    Join Date
    Jun 2003
    Location
    Australia
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Kor couldn't i simplify that

    Hi Kor

    couldn't I simplify your browser identification code to something like

    if ((agent.indexOf('msie')!=-1)
    //identify type of internet explorer
    else
    //identify type of netscape or other

    Thanks Hugh

  • #8
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Well, I think that there are 3 types of browsers to detect (to use that kind of script properly).

    1. Those who use document.GetElementBy(id).style (IE5, IE5.5, IE6, NS6, NS7)

    2. document.all(id)style (IE4)

    3. documnet.layers[id] (NS4)

    So it is not enough to split the detection in two, the IE and others. Of course, the detector above is a complete one, but if u wanna have the minimum detector u have to have those 3 posibilities in mind, i suppose...
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #9
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Only 1 is worth working with - forget document.all and document.layers - they're legacy collections for legacy browsers that you don't need to support anymore.

    So all you'd need is a simple object test:
    Code:
    if(typeof document.getElementById != "undefined")
    {
    
    ... code
    
    }
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #10
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts


    Absolute correct

    ...and add something like

    if(typeof document.getElementById != "undefined")
    {

    ... code

    }

    else if (typeof document.getElementById = "undefined"){
    window.open('http://www.codingforums.com/');
    }

    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #11
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by Kor
    else if (typeof document.getElementById == "undefined"){
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #12
    Regular Coder
    Join Date
    Jun 2002
    Location
    Round Rock, Texas
    Posts
    443
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Let's confuse the issue. Feel free to correct as necessary...

    in *DYNAMIC HTML* the following reference is not valid:

    document.tableName.RowName.CellName

    because there is no object relationship here.

    However in the *DOCUMENT OBJECT MODEL* there is. BUT... instead of referecing the name, you reference the id

    ONE MORE THING:
    In the DOM model for tables there is a tag between <table> and the <tr> tags. Its called <TBODY>. And it's there whether you explicitly code it in HTML or not. But when you do DOM referencing you must account for it. So I guess the best thing to do is explicity put it in and give it an ID too..

    <table name="whocares" id="kitchenTable">
    <TBODY id="tableRowSet">
    <tr name="whocares id="headOf">
    <td name="whocares id="DadsSeat">
    </td>
    </tr>
    <!-- more rows here -->
    </tbody>
    </table>


    Now this should be legal:
    document.kitchenTable.tableRowSet.headOf.DadsSeat

    Am I wrong here?
    Last edited by RadarBob; 06-06-2003 at 10:14 PM.

  • #13
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Yea... but there might be a question here:

    Why use:
    document.kitchenTable.tableRowSet.headOf.DadsSeat

    ....when I suppose it is perfect legally to use

    document.GetElementById('DadsSeat')

    reference?

    I mean... if u can reference any object by his id, why have to specify the whole tree reference? Is it a difference? Is it of some help?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #14
    Regular Coder
    Join Date
    Jun 2002
    Location
    Round Rock, Texas
    Posts
    443
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Why use:
    document.kitchenTable.tableRowSet.headOf.DadsSeat

    ....when I suppose it is perfect legally to use

    document.GetElementById('DadsSeat')

    reference?
    Indeed. Why not. If you know the element id then get it, clean and simple. But when you need to traverse a table, you have to know this stuff.

  • #15
    Regular Coder
    Join Date
    Jul 2002
    Posts
    698
    Thanks
    0
    Thanked 0 Times in 0 Posts
    well if a document is built up as a tree then this:
    document.kitchenTable.tableRowSet.headOf.DadsSeat

    would in theory run faster than this.

    document.GetElementById('DadsSeat')


    cause the first on follows the direct route from the trunk of the tree to the end leaf, where as the later in essense must check all the leafs on the tree for the rigth leaf.

    of course that is only if they have made the element as a tree setup


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •