Datatable responsivness breakes after reloading them!

TheMaco

Hello all,

So my problem is that i have 3 Datatables I load them all via Button and they are all responsive. But then I reload a Table speratly and.. the responsivness from the Tables I didnt load again is broken. First resize the windows then press the Button "Load all Tables" then press "Load First Table" or "Load both last Tables" and then enlarge the window.

Here is my Code (so only the Table I load separtly is responsive) :

Thank you in Advance

<script>
function table1(){  
    $('#disks-table').dataTable( {
    "destroy" : true,
    "responsive" : true,
    })};

function table2(){  
    $('#disks-table1').dataTable( {
    "destroy" : true,
    "responsive" : true,
    })};
function table3(){  
    $('#disks-table2').dataTable( {
    "destroy" : true,
    "responsive" : true,
    })};
</script>

<button onclick="table1()">Load first Table</button>
<button onclick="table2();table3()">Load both last Tables</button>
<button onclick="table1();table2();table3()">Load all Tables</button>   
    <div class="container1" width="100%">

<table id="disks-table" class="table table-bordered table-striped table-hover" cellspacing="0" width="100%">
                <thead>
                    <tr>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                    </tr>
                </thead>
                <tbody>
                          <tr>
                            <td>Tiger Nixon</td>
                            <td>System Architect</td>
                            <td>Edinburgh</td>
                            <td>61</td>
                            <td>2011/04/25</td>
                            <td>$3,120</td>
                          </tr>
                          <tr>
                            <td>Tiger Nixon</td>
                            <td>System Architect</td>
                            <td>Edinburgh</td>
                            <td>61</td>
                            <td>2011/04/25</td>
                            <td>$3,120</td>
                          </tr>
                </tbody>
            </table>
<table id="disks-table1" class="table table-bordered table-striped table-hover" cellspacing="0" width="100%">
                <thead>
                    <tr>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                    </tr>
                </thead>
                <tbody>
                          <tr>
                            <td>Tiger Nixon</td>
                            <td>System Architect</td>
                            <td>Edinburgh</td>
                            <td>61</td>
                            <td>2011/04/25</td>
                            <td>$3,120</td>
                          </tr>
                          <tr>
                            <td>Tiger Nixon</td>
                            <td>System Architect</td>
                            <td>Edinburgh</td>
                            <td>61</td>
                            <td>2011/04/25</td>
                            <td>$3,120</td>
                          </tr>
                </tbody>
                
            </table>
<table id="disks-table2" class="table table-bordered table-striped table-hover" cellspacing="0" width="100%">
                <thead>
                    <tr>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                        <th class="left">Name</th>
                        <th class="left">Size</th>
                    </tr>
                </thead>
                <tbody>
                          <tr>
                            <td>Tiger Nixon</td>
                            <td>System Architect</td>
                            <td>Edinburgh</td>
                            <td>61</td>
                            <td>2011/04/25</td>
                            <td>$3,120</td>
                          </tr>
                          <tr>
                            <td>Tiger Nixon</td>
                            <td>System Architect</td>
                            <td>Edinburgh</td>
                            <td>61</td>
                            <td>2011/04/25</td>
                            <td>$3,120</td>
                          </tr>
                </tbody>
            </table>
        </div>