无法查看数据表的所有列,因为浏览器未显示水平滚动条

时间:2015-03-27 09:39:55

标签: html twitter-bootstrap

我使用bootstrap实现了一个大约有38列的数据表。所有列都显示在eclipse的浏览器中,eclipse在浏览器中显示水平滚动条。但是在chrome或任何其他浏览器中,它没有显示水平滚动条。

1 个答案:

答案 0 :(得分:0)

现在改变了script它正在运行:

<script>
        $( function () {

            /* Data Table Initialization */
            var equipmentDataTable = $('#myTable').dataTable({
                                            "aoColumnDefs": [{ "sClass": "text-center", "aTargets": [ 0,25 ] },
                                                             { 'bSortable': false, 'aTargets': [ 25 ] }],
                                            "sScrollX": '100%'
                                     });

            /* Add row functionality of the table */
            $('#addEquipment').click( function() {

                equipmentDataTable.fnAddData( [ '1',
                                            '<a href="#" class="equipmentDesc" data-type="text">N/A</a>',
                                            '<a href="#" class="equipmentModel" data-type="text">N/A</a>',
                                            '<a href="#" class="equipmentLaborSubGroup" data-type="select">Others</a>',
                                            '<a href="#" class="equipmentHorsepower" data-type="text">N/A</a>',
                                            '<a href="#" class="equipmentMonthlyPrice" data-type="text">0</a>',
                                            '0',
                                            '0',
                                            '<a href="#" class="equipmentMaintenanceBase" data-type="text">0</a>',
                                            '<a href="#" class="equipmentMaintenanceIndex" data-type="text">0.12</a>',
                                            '0',
                                            '<a href="#" class="equipmentFuelBase" data-type="text">0</a>',
                                            '<a href="#" class="equipmentFuel" data-type="text">1.0</a>',
                                            '0',
                                            '<a href="#" class="equipmentLubricantBase" data-type="text">0</a>',
                                            '<a href="#" class="equipmentLubricant" data-type="text">1.0</a>',
                                            '0',
                                            '<a href="#" class="equipmentLaborRate" data-type="select">0</a>',
                                            '0',
                                            '0',
                                            '0',
                                            '<a href="#" class="equipmentCapabilityOutput" data-type="text">0</a>',
                                            '<a href="#" class="equipmentCapabilityUnit" data-type="text">N/A</a>',
                                            '<a href="#" class="equipmentCapabilityPeriod" data-type="select">N/A</a>',
                                            '<a href="#" class="equipmentRemarks" data-type="text">N/A</a>',
                                            '<input type="checkbox" class="deleteEquipmentCheckBox">' ] );      
            });

            /* Delete row functionality of the table */
            $('#deleteEquipment').click( function() {
                $('input.deleteEquipmentCheckBox:checked').each( function () {
                    equipmentDataTable.fnDeleteRow( $(this).closest('tr')[0], false );
                } );
                equipmentDataTable.fnDraw();
            });
        });
        </script>