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 2 of 2
  1. #1
    New Coder
    Join Date
    Jan 2008
    Posts
    93
    Thanks
    30
    Thanked 0 Times in 0 Posts

    Setting colspan at runtime

    Hello,
    I want to set the colspan of a header in a table to equal the number of columns in a datarow under it at runtime. Is this possible and how would I do it?

    Thanks,
    Don

  • #2
    Regular Coder
    Join Date
    Mar 2008
    Posts
    301
    Thanks
    2
    Thanked 30 Times in 30 Posts
    Styles might do it. Of course, only a suggestion, since this won't work in IE6, which is still widely used (unfortunately).

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
    <html>
    <head>
    
    <style>
    
    #tabl {
    	display: table;
    	width: 40&#37;;
    }
    
    div >div {
    	display: table-caption;
    	background: #ffa;
    	font-variant: small-caps;
    	font-size: 110%;
    	padding: 0.3em;
    	text-align: center;
    }
    
    div >span {
    	display: table-cell;
    	padding: 0.5em;
    	background: #aff;
    	border-left: 1px solid #000;
    }
    
    BR {
    	display: table-row;
    }
    
    </style>
    
    </head>
    
    <body>
    
    <div id="tabl">
    <div>Header</div>
    <span>data1</span>
    <span>data2</span>
    <span>data3</span>
    <span>data4</span>
    <span>data5</span>
    <span>data6</span>
    <span>data7</span>
    <span>data8</span><br>
    <span>data9</span>
    <span>data10</span>
    <span>data11</span>
    <span>data12</span>
    <span>data13</span>
    <span>data14</span>
    <span>data15</span>
    <span>data16</span>
    </div>
    
    <script>
    
    
    </script> 
    
    </body>
    </html>
    If on the other hand you need a table, you could make your caption a - caption - or a header - TH. Table -> TH -> TR . . td /td /TR, like that. And you could give the TH its own id and use getElementById, or if it's just the one table, a getElementsByTagName("th")[0] . You can then directly change its colspan, if you've counted the number of columns.

    In IE6, though, remember that 'colspan' is a 'camel-case' name. So not, "colspan", but "colSpan".

  • Users who have thanked fside for this post:

    dragon6158 (05-07-2008)


  •  

    Posting Permissions

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