Accessing Table Cells Within Nested Frames

Discussion in 'Javascript' started by Chris New, Jul 13, 2003.

  1. Chris New

    Chris New Guest

    G'Day All

    I am having trouble dynamically assigning a value to a table's cell
    from one frame to another frame.

    I've created a website that is primarily viewed in a frameset
    consisting of 2 frames - a navigation frame (navFrame) at the top and
    a contents frame (mainFrame) on the bottom. In all instances, the
    mainFrame displays a single page except in one case, where it was
    necessary to use a frameset consisting of a left frame (controlFrame)
    and a right frame (tableFrame).

    The tableFrame contains an HTML table used to display items that are
    added or removed using the controlFrame through the use of JavaScript
    functions. This used to be on a single page and all worked fine, but
    it became necessary to break it out into frames since the tableFrame
    required scrolling and I didn't want the controlFrame contents to
    scroll out of sight.

    In the controlFrame, there is a ListBox (cbSelection) and buttons to
    perform things like ClearTable, SaveTable, etc. If I can get the
    adding of data to the table done, the rest should fall into place and
    this is where your help can get me throught it.

    Initially, when all was on a single page, the following code performed
    as expected:

    Code:
    .... Variable Declarations and Intializations ...
    
    iIndex = document.Form1.cbSelection.selectedIndex
    strItem = document.Form1.cbSelection.options[iIndex].text
    strContent = document.Form1.cbSelection.options[iIndex].value;
    
    strTableCell = "R" + iRow + "C" + iColumn;
    document.getElementById(strTableCell).innerHTML = strItem;
    
    strTableCell = "R" + iRow + "C" + (iColumn + 1);
    document.getElementById(strTableCell).innerHTML = strContent;
    

    After reading through the NG's to get an idea of how to proceed with
    communicating across frames, I have tried (and failed to get working)
    the following methods:

    Code:
    parent.document.frames["tableFrame"].getElementById(strTableCell).innerHTML
    = strContent;
    
    Code:
    parent.document.frames.item('tableFrame').getElementById(strTableCell).innerHTML
    = strContent;
    
    Code:
    parent.document.frames['tableFrame'].getElementById(strTableCell).innerHTML
    = strContent;
    
    Code:
    parent.document.tableFrame.getElementById(strTableCell).innerHTML =
    strContent;
    
    Code:
    top.mainFrame.tableFrame.getElementById(strTableCell).innerHTML =
    strContent;
    
    Code:
    parent.tableFrame.getElementById(strTableCell).innerHTML = strContent;
    
    Code:
    window.mainFrame.tableFrame.getElementById(strTableCell).innerHTML =
    strContent;
    

    What am I doing wrong here? Am I somewhere in the ballpark with the
    direction in which I'm trying to accomplish this task? Is there a
    better way to do this?

    Please post all answers to the newsgroup so that others might benefit
    from your expertise as I am sure I'm not the only one to run into
    this.


    Cheers,
    Chris.
     
    Chris New, Jul 13, 2003
    #1
    1. Advertising

  2. Chris New

    Chris New Guest

    > > I am having trouble dynamically assigning a value to a table's cell
    > > from one frame to another frame.
    > >

    >
    > value? A text node or html markup?


    Guess I should have clarified this - Entering Text in the table cells.


    > When a page design is a bit complex, then providing an url is best in
    > this newsgroup (and in other web design newsgroups). It saves so much
    > time to experts and regulars of newsgroups. I know that many regulars
    > and experts in this newsgroup can read the code of a page as well as you
    > can read a newspaper headlines.


    This is a good point and it is well taken, but I do not have a WWW DNS
    entry and my IP Address is dynamic which is why I tried to explain it
    as best I could. Perhaps next time I should include a picture like:

    _______________________________________________
    ( )
    ( navFrame )
    (_______________________________________________)
    ( )
    ( mainFrame )
    ( ___________________________________________ )
    ( ( ) ) )
    ( ( ) ) )
    ( ( ) ) )
    ( ( ) ) )
    ( ( controlFrame ) tableFrame ) )
    ( ( ) ) )
    ( ( ) ) )
    ( ( ) ) )
    ( ( ) ) )
    ( ( ) ) )
    ( ( ) ) )
    ( (______________)____________________________) )
    (_______________________________________________)



    > I encourage you to keep prefixing objects the way you do (and I have
    > adopted this code writing policy too):
    > i for integer, cb for combobox, str for string, etc...
    > This code writing policy helps tremendously debugging with software,
    > code maintenance, code reusability, code review by others, etc..


    No need to encourage me in using Hungarian Notation. I am a strong
    proponent in this style of coding and have been using and teaching it
    for years. I believe in being able to read through code as if it were
    "a story". I don't even shorten variable names, for example iCol, but
    instead write out iColumn.


    > > strTableCell = "R" + iRow + "C" + iColumn;
    > > document.getElementById(strTableCell).innerHTML = strItem;

    >
    > May I suggest here
    > document.getElementById(strTableCell).childNodes[0].nodeValue = strItem;
    > This will speed up parsing and rendering by at least 300% on all W3C web
    > standards compliant DOM 1 Character Data browsers: MSIE 5+, NS 6+, Opera
    > 7.x, Konqueror 3, etc.


    Thank-you very much for this information. Although I am aware that it
    takes more time to parse using my original technique, I was surprised
    to learn that a 300% increase was the benefit in your suggestion.
    Knowledge is good and I am now putting it into practice.

    > >
    Code:
    > > parent.document.frames["tableFrame"].getElementById(strTableCell).innerHTML
    > > = strContent;
    > > 
    > >

    >
    > Please try:
    > parent.frames["tableFrame"].document.getElementById(strTableCell).childNodes[0].nodeValue



    And this was the answer I've been seeking. It appears I just had the
    'document' and 'frames' components in the wrong place (aside from the
    innerHTML/nodeValue).

    Thanks again DU - you've been a great help!


    Cheers,
    Chris.
     
    Chris New, Jul 14, 2003
    #2
    1. Advertising

  3. Chris New

    DU Guest

    Chris New wrote:

    >>>I am having trouble dynamically assigning a value to a table's cell
    >>>from one frame to another frame.
    >>>

    >>
    >>value? A text node or html markup?

    >
    >
    > Guess I should have clarified this - Entering Text in the table cells.
    >


    No prob. Your "str" prefix suggested it was TEXT_NODE, kinda answered
    that question :)

    >
    >
    >>When a page design is a bit complex, then providing an url is best in
    >>this newsgroup (and in other web design newsgroups). It saves so much
    >>time to experts and regulars of newsgroups. I know that many regulars
    >>and experts in this newsgroup can read the code of a page as well as you
    >>can read a newspaper headlines.

    >
    >
    > This is a good point and it is well taken, but I do not have a WWW DNS
    > entry and my IP Address is dynamic which is why I tried to explain it
    > as best I could. Perhaps next time I should include a picture like:
    >
    > _______________________________________________
    > ( )
    > ( navFrame )
    > (_______________________________________________)
    > ( )
    > ( mainFrame )
    > ( ___________________________________________ )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( ( controlFrame ) tableFrame ) )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( ( ) ) )
    > ( (______________)____________________________) )
    > (_______________________________________________)
    >
    >
    >
    >
    >>I encourage you to keep prefixing objects the way you do (and I have
    >>adopted this code writing policy too):
    >>i for integer, cb for combobox, str for string, etc...
    >>This code writing policy helps tremendously debugging with software,
    >>code maintenance, code reusability, code review by others, etc..

    >
    >
    > No need to encourage me in using Hungarian Notation. I am a strong
    > proponent in this style of coding and have been using and teaching it
    > for years. I believe in being able to read through code as if it were
    > "a story". I don't even shorten variable names, for example iCol, but
    > instead write out iColumn.
    >
    >


    I am also a strong proponent of meaningful, intuitive variable
    identifiers. :)

    >
    >>>strTableCell = "R" + iRow + "C" + iColumn;
    >>>document.getElementById(strTableCell).innerHTML = strItem;

    >>
    >>May I suggest here
    >> document.getElementById(strTableCell).childNodes[0].nodeValue = strItem;
    >>This will speed up parsing and rendering by at least 300% on all W3C web
    >>standards compliant DOM 1 Character Data browsers: MSIE 5+, NS 6+, Opera
    >>7.x, Konqueror 3, etc.

    >
    >
    > Thank-you very much for this information. Although I am aware that it
    > takes more time to parse using my original technique, I was surprised
    > to learn that a 300% increase was the benefit in your suggestion.
    > Knowledge is good and I am now putting it into practice.
    >


    On a fast machine, the performance gain is negligeable but on a slow
    (< 600Mhz) machine, this is where the performance gain is most
    noticeable and the most welcomed.

    >
    >>>
    Code:
    >>>parent.document.frames["tableFrame"].getElementById(strTableCell).innerHTML
    >>>= strContent;
    >>>
    >>>

    >>
    >>Please try:
    >>parent.frames["tableFrame"].document.getElementById(strTableCell).childNodes[0].nodeValue

    >
    >
    >
    > And this was the answer I've been seeking.


    In your original post, you rightly mentioned that figuring out the DOM
    logic was not evident and I think you have an important point here. Even
    in books, the DOM logical view is not self-explanatory, easy to figure
    out. I think comp.lang.javascript and other related web programming
    newsgroups should build a DOM logical view which would serve as a
    reliable reference, share it and put it in their respective FAQs so that
    everyone can see it, consult it and refer others to it when needed.

    I have several logical view images of the DOM event models (3), W3C DOM
    2 interfaces, CSS2 box model, MSIE 5.x DHTML object model, etc.. These
    are extremely useful. I'll upload them next week on my site in 1 section.

    It appears I just had the
    > 'document' and 'frames' components in the wrong place (aside from the
    > innerHTML/nodeValue).
    >
    > Thanks again DU - you've been a great help!
    >


    Thank you for your nice comments: this is appreciated. :)
    Glad I could help. :)

    >
    > Cheers,
    > Chris.


    take care

    DU
    --
    Javascript and Browser bugs:
    http://www10.brinkster.com/doctorunclear/
     
    DU, Jul 14, 2003
    #3
    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. Replies:
    0
    Views:
    559
  2. Ultrus
    Replies:
    3
    Views:
    412
    Stefan Behnel
    Jul 9, 2007
  3. Ole Streicher
    Replies:
    3
    Views:
    2,917
    Ole Streicher
    Apr 11, 2008
  4. Joel Finkel

    Cells[].Text or Cells[].Controls[0]

    Joel Finkel, Sep 1, 2003, in forum: ASP .Net Datagrid Control
    Replies:
    0
    Views:
    343
    Joel Finkel
    Sep 1, 2003
  5. contrapositive

    Frames within Frames - help!

    contrapositive, Jan 24, 2005, in forum: Javascript
    Replies:
    1
    Views:
    132
    Randy Webb
    Jan 24, 2005
Loading...

Share This Page