This is accomplished in Mendix using CSS. At it's most basic level, this can be done by adding inline styles to your data grid. Look for the style property under the Common tab.
In that style property, try adding this:
width: 2000px;
I believe this should set the data grid's width to 2000 pixels (you can make this higher or lower as you need),
Next, add a Container widget, and put your datagrid inside of it. Add this style to that container:
overflow-x:scroll;
That will force a horizontal scrollbar to appear around the grid. Your search and control button pane will scroll horizontally as well, but you would need to do some more in-depth CSS to keep them locked in place.
For a more in-depth discussion on styling your Mendix app, see the resources here:
Hi Christina,
By using css we can able to apply the scroll bar.
Create a separate class and use the below code to add the scrollbar and add the class in that grid..
display: block;
overflow-x: auto;
white-space: nowrap;
In case of list view, use two containers and add the two css properties in the outer and inner containers.
I added this in the outer container
overflow-x:scroll;
width:800px;
and
width: 2000px;
in the inner container.
AFAIK this isn't possible. You could try using the Datagrid Extension widget from the App Store for more controlability of your grid (if the widget is still Mx6 compatible).
Hi,
Adding overflow-x ..etc on datagrid adds up the horizontal scroll but that is always moving. Adding container as suggested above, fixes the Horizontal scroll.
This worked for me as well. Thanks