CODEWITHSUNDEEP
javascriptjqueryhtmlcssdatatable
Emad
Emad

Reputation: 277

Datatable size change

I am using jquery datatable and I need to contain the table inside a container

for now the table width exceedthe container

I tried the following

1- set the sWidth option on the table and on the columns

3- set the bAutoWidth to false

2- change the value of dataTables_wrapper

nothing works

my code look like this

the JS 

$scope.dtOptions = DTOptionsBuilder
                    .fromSource('api/fromRest')


$scope.dtColumns = [
                    DTColumnBuilder.newColumn('firstCol').withTitle('first')
.....

the HTML 

<table datatable="ng" dt-options="dtOptions" dt-columns="dtColumns"
   dt-column-defs="dtColumnDefs">
<tfoot>
<tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
</tr>
</tfoot>
</table>

Upvotes: 0

Views: 1633

Answers (2)

TPLMedia24
TPLMedia24

Reputation: 45

create a css file and set width

html structure

<div id="container">
<div id="table"></div>
</div>

css

#table{
width: 600px !important;
}

Alternative

    <div id="container">
<table id="example" class="display" cellspacing="0" width="100%">
    </div>

It will automatically set width to your container div. If it does not work, please show me full html code

Upvotes: 1

edocCode
edocCode

Reputation: 11

Two things spring to mind - firstly are you calling fnAdjustColumnSizing whenthe table is made visible, and do you have a CSS declaration something like table { width: 100% }?

Upvotes: 0

Related Questions