dataTable Responsive
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/dataTables.bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.1.1/js/dataTables.responsive.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.1.1/js/responsive.bootstrap.min.js"></script>
<p>Click on Add option button to add options in dropdown</p>
<button type="button" id="btn1">
Add option
</button>
<br/>
<table class="table table-striped table-hover" id="myTable">
<thead>
<tr>
<th>Indent No.</th>
<th>Warehouse</th>
<th>Item</th>
<th>Make/Catno</th>
<th>UOM</th>
<th>Qty</th>
<th>Qty P</th>
<th>Sh Cl</th>
<th>Date</th>
<th>SortDate</th>
<th>Rqt Dt</th>
<th>Dropdown</th>
<th>Cost Centre</th>
<th>Remarks</th>
<th>By</th>
<th>Entry</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>INDMSF/16-17/00003</td>
<td>Furnace</td>
<td>Bearing 22317 EW33J</td>
<td></td>
<td>no</td>
<td>2.0</td>
<td>2.0</td>
<td></td>
<td>31/08/16</td>
<td>08/31/16</td>
<td>31/08/16</td>
<td><select id="ddlTest" class="ddlTest" style="width: 300px"></select></td>
<td></td>
<td></td>
<td>Ashfaque</td>
<td>Ayush Jhunjhunwala</td>
<td><input class="btn btn-default btn-xs" name="155" type="submit" value=">" /></td>
</tr>
</tbody>
</table>
JavaScript
$('#myTable').DataTable( {
responsive: true
} );
$(document).ready(function() {
$("#btn1").click(function(){
var ddl = $('.ddlTest');
ddl.append($("<option></option>").val('0').html('Selectvalue'));
});
} );