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.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Apr 2012
    Posts
    104
    Thanks
    27
    Thanked 2 Times in 2 Posts

    Multiple tbodies....

    Can multiple tbodies inside a table do any harm??
    Last edited by Peeyush; 05-17-2012 at 10:59 AM. Reason: tpyo
    Everything is simpler with jQuery!

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    At http://javascriptexample.net/ex/domtable11.htm I have an example of a table with three separate <tbody> tags to illustrate my version of a stripy table JavaScript that applies alternate colours to alternate rows within each tbody. Each tbody only has a value in the first column in the first row so you can easily see where each starts even when the prior row was the alternate colour.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #3
    Regular Coder
    Join Date
    Apr 2012
    Posts
    104
    Thanks
    27
    Thanked 2 Times in 2 Posts
    hey! thanks for your post. well this is my html code: (numbers are line numbers)

    Code:
    32:<table id="tabul1" border="1px">
    33:<tbody id='tb1'></tbody><tbody></tbody>
    34:</table>
    when i validated it i got this:

    Line 33, Column 24: end tag for "tbody" which is not finished
    <tbody id='tb1'></tbody><tbody></tbody>

    Most likely, you nested tags and closed them in the wrong order. For example <p><em>...</p> is not acceptable, as <em> must be closed before <p>. Acceptable nesting is: <p><em>...</em></p>

    Another possibility is that you used an element which requires a child element that you did not include. Hence the parent element is "not finished", not complete. For instance, in HTML the <head> element must contain a <title> child element, lists require appropriate list items (<ul> and <ol> require <li>; <dl> requires <dt> and <dd>), and so on.

    Line 33, Column 39: end tag for "tbody" which is not finished
    <tbody id='tb1'></tbody><tbody></tbody>

    Most likely, you nested tags and closed them in the wrong order. For example <p><em>...</p> is not acceptable, as <em> must be closed before <p>. Acceptable nesting is: <p><em>...</em></p>

    Another possibility is that you used an element which requires a child element that you did not include. Hence the parent element is "not finished", not complete. For instance, in HTML the <head> element must contain a <title> child element, lists require appropriate list items (<ul> and <ol> require <li>; <dl> requires <dt> and <dd>), and so on.


    I do not wish to add any childnode to tbodies, as required nodes will be added by my JS. any suggestions what shall i do?
    Everything is simpler with jQuery!

  • #4
    Regular Coder
    Join Date
    Apr 2012
    Posts
    104
    Thanks
    27
    Thanked 2 Times in 2 Posts
    yeah but i wanna keep tbodies empty. content will later on be added by javaScript. anything i can do? sometime back i came across some hide property i dont know if its in JS, CSS or Jqerry. can i hide content of my tbodies? coz anyways later on javascript will empty everything inside the tbodies and then add the required content......
    Everything is simpler with jQuery!

  • #5
    Regular Coder
    Join Date
    Apr 2012
    Posts
    104
    Thanks
    27
    Thanked 2 Times in 2 Posts
    also 1 more thing. i have a form on my webpage, but i donot wish to save the data the user enters, it is just for taking inputs for further processing by Javascript, and validator says attribute 'action' is missing from my form and it is 'mandatory'...

    and what is w3 validator really for? what happens if you donot pass validation, i mean non validated webpages are working just fine when uploaded. is it that some old browsers might not display my page correctly if my code is a not validated...?
    Everything is simpler with jQuery!

  • #6
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,778
    Thanks
    6
    Thanked 1,021 Times in 994 Posts
    Quote Originally Posted by Peeyush View Post
    yeah but i wanna keep tbodies empty. content will later on be added by javaScript.
    In this case you should also add the table body row groups (<tbody>) with JavaScript. There is no point and semantic value in having them there, hardcoded into the HTML but without any content.

    And without knowing what you intend to do let me remind you: Since JS can be disabled you should think of a solution that works without JS before you start thinking about adding rows and stuff with JS. Because there is also no point in having an empty non-working table at all.

  • #7
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by iBall View Post
    I don't know what your stripy table has to do with the op's issue but in any case, why on earth use javascript to create alternate coloured rows in a table unless as a very last resort where a server side language capable of doing it is not available.
    1. The HTML in that example has multiple <tbody> tags used in an appropriate way. So that answered the OP's question with an actual HTML example rather than just making a statement. The JavaScript in the page is irrelevant to the question but I don't have a copy of that HTML without the JavaScript.

    2. That JavaScript example was written because there are proper JavaScript courses out there that use that as a homework exercise and I wrote that to demonstrate that all of the answers being given used way more JavaScript than necessary.

    For a real world situation you'd apply the stripes with two lines of CSS and not touch the HTML (and not use any JavaScript) using:

    Code:
    tbody tr:nth-child(odd) {background-color: #fff;}
    tbody tr:nth-child(even) {background-color: #ccc;}
    but of course this is all irrelevant to the OP's question where it is the HTML of that page only that provides an example of the answer.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.


  •  

    Posting Permissions

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