CODEWITHSUNDEEP
javascriptjquery
nakiya
nakiya

Reputation: 14423

Why isn't this second table not visible?

I have two tables in a page like this:

<table style="width:800px">
    <tr>
        <td style="width:400px;">
            <table id="currencies"
                style="border-spacing: 5px; padding: 3px; margin: 2px" />
        </td>
        <td style="width:400px;">
            <table id="changers"
                style="border-spacing: 5px; padding: 3px; margin: 2px" />
        </td>
    </tr>
</table>

I use jqgrid to extend these. One is the master table while the other is the detail. The problem however is the second table (id = "changers") is not being displayed in the page. I inspected the javascript from the browser and it has only one <td> element within the table row. This problem goes away if I put them in separate tables like so:

<table id="currencies"
                style="border-spacing: 5px; padding: 3px; margin: 2px" />
<table id="changers"
                style="border-spacing: 5px; padding: 3px; margin: 2px" />

I'm totally stuck on this. Any help is appreciated.

Upvotes: 2

Views: 89

Answers (2)

T.J. Crowder
T.J. Crowder

Reputation: 1075039

Your two nested table tags aren't closed. The <tag/> form is not a shorthand form of <tag></tag>, it's purely for void elements like <br/> that don't ever have markup content (and also for foreign elements, details in the spec), and you only need the solidus (/) in XHTML (which I recommend avoiding unless you have a very specific need to use it, XHTML is fraught with peril and misconception).

Explicitly close the tables with <table ...></table> rather than <table .../>:

<table style="width:800px">
    <tr>
        <td style="width:400px;">
            <table id="currencies"
                style="border-spacing: 5px; padding: 3px; margin: 2px"></table>
        </td>
        <td style="width:400px;">
            <table id="changers"
                style="border-spacing: 5px; padding: 3px; margin: 2px"></table>
        </td>
    </tr>
</table>

Upvotes: 3

Peter Rasmussen
Peter Rasmussen

Reputation: 16932

You should add closing tags to your tables. Instead of this

<table />

do this 

<table> </table>

The whole code:

<table style="width:800px">
    <tr>
        <td style="width:400px;">
            <table id="currencies"
            style="border-spacing: 5px; padding: 3px; margin: 2px" ></table>
        </td>
        <td style="width:400px;">
            <table id="changers"
            style="border-spacing: 5px; padding: 3px; margin: 2px" ></table>
        </td>
    </tr>
</table>​

Upvotes: 1

Related Questions