[midnigther]

Hey people, I'm new here and also a newbie user of grocery crud.
Recently I made a grid from a large database table with 24 columns. Unexpectedly I noticed that grid doesn't have a horizontal scroll bar. The columns prolonging after the content of my page. Let me show you the issue:

[img]https://lh6.googleusercontent.com/-__L2MUsGyUs/UARUhfj2GUI/AAAAAAAAANk/N4g3gEU6W_A/s989/Screenshot+from+2012-07-15+20%3A55%3A36.png[/img]

Any solution to fix it?

[web-johnny]

Hello [member='midnigther'] and welcome to the forum

You can simply add this CSS style:

.dataTables_wrapper {

	   overflow: auto;

}

and you will have a great scroll bar at overflow.

[Matt]

The overflow method is clunky. This is a built in feature of datatables.

The best way to handle this is to simply destory the initial initialisation and use your own so that you can set this property.

 var oTable2 = $('#groceryCrudTable').dataTable({"bDestroy":true,"sScrollX": "100%",

"sScrollXInner": "150%",

"bScrollCollapse": true});

If you download the Fixed Column plugin http://datatables.net/extras/
you can also make your first and last (or whatever) columns static - useful for keeping names and action buttons showing.

new FixedColumns( oTable, {

"iLeftColumns": 1,

"iRightColumns": 1

} );

[flint]

Can one send instructions on how and where to implement the scroll bar code

[joakin1602]

Sorry for revive this post, but I need a solution for this, I tried Matt's solution but it didn't work for me or I didn't understand it.

 

Thank you

[NoWay]

Sorry for revive this post, but I need a solution for this, I tried Matt's solution but it didn't work for me or I didn't understand it.

 

Thank you

Hello, you need to add to the css file the next code.

.dataTables_wrapper {
	   overflow: auto;
}

  If you are use the datatable theme go to assets/grocery_crud/themes/datatables/css/datatables.css and add the code.

[joakin1602]

Hello, you need to add to the css file the next code.

.dataTables_wrapper {
	   overflow: auto;
}

  If you are use the datatable theme go to assets/grocery_crud/themes/datatables/css/datatables.css and add the code.

 

I saw this solution in the forum, but it is a poor solution. Thanks but I will not use this ^^', I think I will buy bootstrap theme....