1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 | // DATA_TEMPLATE: dom_data oTest.fnStart( "aoColumns.sWidth" ); /* NOTE - we need to disable the auto width for the majority of these test in order to preform * these tests as the auto width will convert the width to a px value. We can do 'non-exact' tests * with auto width enabled however to ensure it scales columns as required */ $(document).ready( function () { /* Check the default */ var oTable = $('#example').dataTable( { "bAutoWidth": false, "aoColumns": [ null, { "sWidth": '40%' }, null, null, null ] } ); var oSettings = oTable.fnSettings(); oTest.fnTest( "With auto width disabled the width for one column is appled", null, function () { return $('#example thead th:eq(1)')[0].style.width == "40%"; } ); oTest.fnTest( "With auto width disabled the width for one column is appled", function () { oSession.fnRestore(); oTable = $('#example').dataTable( { "bAutoWidth": false, "aoColumns": [ null, null, { "sWidth": '20%' }, { "sWidth": '30%' }, null ] } ); }, function () { var bReturn = $('#example thead th:eq(2)')[0].style.width == "20%" && $('#example thead th:eq(3)')[0].style.width == "30%"; return bReturn; } ); oTest.fnTest( "With auto width, it will make the smallest column the largest with percentage width given", function () { oSession.fnRestore(); oTable = $('#example').dataTable( { "aoColumns": [ null, null, null, { "sWidth": '40%' }, null ] } ); }, function () { var anThs = $('#example thead th'); var a0 = anThs[0].offsetWidth; var a1 = anThs[1].offsetWidth; var a2 = anThs[2].offsetWidth; var a3 = anThs[3].offsetWidth; var a4 = anThs[4].offsetWidth; if ( a3>a0 && a3>a1 && a3>a2 && a3>a4 ) return true; else return false; } ); oTest.fnComplete(); } ); |