Hiding table row(s) using (nested) <div>(s) {x-posted in c.l.javascript}

Discussion in 'HTML' started by F. Da Costa, Dec 3, 2003.

  1. F. Da Costa

    F. Da Costa Guest

    Following is a snippet of html in which I hide a whole table and try to
    hide a single row.

    Here is my question (plz don't chew my head off if its css related instead):
    Why does the divTable <div> Hide/Show work but not the divRow version?

    What I'm trying to do here is simultaneously hide 1 or more rows
    (possibly with nested divs as well).
    This would allow for an elegant an well performing base for an html base
    treetable (but I guess that's not relevant).

    Any suggestions appreciated.

    TIA
    Fermin DCG


    <html>
    <head>
    <script>

    function show(obj) {
    document.getElementById(obj).style.display =
    (document.getElementById(obj).style.display=='block') ? 'none': 'block';
    }

    </script>
    </head>

    <body>

    <div style="display: block" id="divTable">
    <table border="1">
    <div style="display: block" id="divRow">
    <tr><td>Hide / Show row</td></tr>
    </div>
    <tr><td>Do nothing row</td></tr>
    </table>
    </div>

    <br>
    <input type="button" onclick="show('divTable')" value="Hide/Show table">
    <input type="button" onclick="show('divRow')" value="Hide/Show Row">

    </body>
    </html>
     
    F. Da Costa, Dec 3, 2003
    #1
    1. Advertising

  2. F. Da Costa

    altamir Guest

    "F. Da Costa" <> wrote in
    news:3fce55fb$0$205$4all.nl:

    > What I'm trying to do here is simultaneously hide 1 or more rows
    > (possibly with nested divs as well).


    > function show(obj) {
    > document.getElementById(obj).style.display =
    > (document.getElementById(obj).style.display=='block') ? 'none':
    > 'block'; }


    > <div style="display: block" id="divTable">
    > <table border="1">


    why not just <table id="divTable" ...>
    you don't need to put extra div element here.

    > <div style="display: block" id="divRow">


    it's incorrect. div element is not allowed here. that's why your script
    isn't working.

    > <tr><td>Hide / Show row</td></tr>


    try <tr style="display: block" id="divRow"> and it should work fine

    > </div>
    > <tr><td>Do nothing row</td></tr>
    > </table>
    > </div>


    > <br>
    > <input type="button" onclick="show('divTable')" value="Hide/Show
    > table"> <input type="button" onclick="show('divRow')" value="Hide/Show
    > Row">



    --
    altamir
     
    altamir, Dec 3, 2003
    #2
    1. Advertising

  3. F. Da Costa

    F. Da Costa Guest

    altamir wrote:
    > "F. Da Costa" <> wrote in
    > news:3fce55fb$0$205$4all.nl:
    >
    >
    >>What I'm trying to do here is simultaneously hide 1 or more rows
    >>(possibly with nested divs as well).

    >
    >
    >>function show(obj) {
    >> document.getElementById(obj).style.display =
    >>(document.getElementById(obj).style.display=='block') ? 'none':
    >>'block'; }

    >
    >
    >><div style="display: block" id="divTable">
    >> <table border="1">

    >
    >
    > why not just <table id="divTable" ...>
    > you don't need to put extra div element here.

    Yep that's correct but that was basically there to show the difference
    (and to test for myself)
    >
    >> <div style="display: block" id="divRow">

    >
    >
    > it's incorrect. div element is not allowed here. that's why your script
    > isn't working.

    Fair enough.
    Is there however anything else that would allow me to 'grab' a hold of
    all the 'encapsulated' objects (as they are by div) and deal with them
    from that (higher) level.
    Just tried it with <table> (looking extremely ugly and not quite
    intuitive) and that does work.
    >
    >> <tr><td>Hide / Show row</td></tr>

    >
    > try <tr style="display: block" id="divRow"> and it should work fine

    That was what I started with but I wanted to move into the direction as
    described above.

    Thx for the reply so far

    >
    >
    >> </div>
    >> <tr><td>Do nothing row</td></tr>
    >> </table>
    >></div>

    >
    >
    >
    >><br>
    >><input type="button" onclick="show('divTable')" value="Hide/Show
    >>table"> <input type="button" onclick="show('divRow')" value="Hide/Show
    >>Row">

    >
    >
    >
     
    F. Da Costa, Dec 3, 2003
    #3
  4. F. Da Costa wrote:
    > x-posted in c.l.javascriptx-posted in c.l.javascript


    No, you multi-posted. Multi-posting makes replies from each group only
    go to that group, instead of each group where the message was posted.
    Please cross-post instead.
     
    Leif K-Brooks, Dec 3, 2003
    #4
  5. F. Da Costa

    F. Da Costa Guest

    Leif K-Brooks wrote:
    > F. Da Costa wrote:
    >
    >> x-posted in c.l.javascriptx-posted in c.l.javascript

    >
    >
    > No, you multi-posted. Multi-posting makes replies from each group only
    > go to that group, instead of each group where the message was posted.
    > Please cross-post instead.


    Ah, there is a difference. I wasn't aware of that, another thing learned
    today ;).
    Any chance you could fill me in on how to go about *true* cross post
    instead.
    I'm using Moz Thunderbird (if that is relevant)

    TIA
    Fermin DCG
     
    F. Da Costa, Dec 4, 2003
    #5
  6. F. Da Costa

    F. Da Costa Guest

    Never mind my last message (slow pickup), I figured it out.

    Thx nonetheless.

    Leif K-Brooks wrote:
    > F. Da Costa wrote:
    >
    >> x-posted in c.l.javascriptx-posted in c.l.javascript

    >
    >
    > No, you multi-posted. Multi-posting makes replies from each group only
    > go to that group, instead of each group where the message was posted.
    > Please cross-post instead.
    >
     
    F. Da Costa, Dec 4, 2003
    #6
  7. F. Da Costa wrote:
    > Never mind my last message (slow pickup), I figured it out.
    >
    > Thx nonetheless.


    Another lesson is not top-posting. Take a look at
    http://allmyfaqs.com/faq.pl?How_to_post
     
    Leif K-Brooks, Dec 4, 2003
    #7
    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. phl
    Replies:
    1
    Views:
    4,351
    Martin Jay
    Jun 8, 2006
  2. jc
    Replies:
    10
    Views:
    3,665
    Kevin Scholl
    Jun 30, 2009
  3. D
    Replies:
    0
    Views:
    219
  4. F. Da Costa

    Hiding rows in a table via <div>

    F. Da Costa, Dec 3, 2003, in forum: Javascript
    Replies:
    8
    Views:
    208
    F. Da Costa
    Dec 5, 2003
  5. Mel
    Replies:
    1
    Views:
    403
    Martin Honnen
    Apr 8, 2007
Loading...

Share This Page