Setting sWidth for 2 different Tables on same page?

redwall

Hello,

I have 2 tables on my page each of which have a class name of [code] .data-table [/code] These tables also have unique ID's [code] #table1 [/code] and [code] #table2 [/code]

I am using [code] sWidth [/code] to handle the column widths but as the number of columns in Table 2 is different to table 1 the table breaks as I am defining sWidth globally using the class of /date-table (see code below).

How can I define sWidh uniquely for each table? I have tried splitting up the JS using seperate id's for each table but does not work and table breaks.

My JS which handles the table is as follows

[code]
$('.data-table').dataTable({
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"sDom": '<""fl>t<"F"p>',
"bAutoWidth": false,
"aoColumns": [{"sWidth":"5%"},{"sWidth":"10%"},{"sWidth":""},{"sWidth":""},{"sWidth":"50%"}],
"oLanguage": {
"sLengthMenu": "Show _MENU_",
"sSearch": "Filter"
}
});

[/code]

So essentially I want to define sWidth for Table 1 and a different sWidth for Table 2, all other variables are the same.

Thanks

allan

> How can I define sWidh uniquely for each table?

You need to initialise the two tables with different settings, since you want different settings for the two tables :-). Using the IDs sounds like a good way to do. If that doesn't work for you, please link to a test case.

Allan

redwall

Hi Allan, thanks yeah what you suggest is pretty much what I did...

[code] $('#table1').dataTable [/code]

[code] $('#table2').dataTable [/code]

but it did not work or treat them individually.

I will try link back with a test case on JSFiddle. Right now I am working locally.

Cheers

redwall

Sorry, my bad! I actually was doing some stupid an including a class twice to set up the tables. So, yes above works when using separate id's...thanks