Tag: horizontal

There are a few CSS items needed to enable horizontal scrolling in your dojo/dgrid and OnDemandGrid. This isn’t currently documented on the dgrid help pages so I’m posting it here. For Dojo users reading this, I’m referring to the “new” dgrid beta currently hosted on github, and not the legacy dojox datagrid.

Basically, you need to assign a width to the dgrid, the cells within the dgrid, and potentially to any columnSets you may be using. Once you do that you should see the horizontal scroll bar show up. I’ve noted on some apps that use a grid width of 100% the horizontal scroll bar doesn’t show up until the user adjusts the screen size to be smaller.

I would provide a full example but there aren’t any public and free CDNs that I know of hosting the dgrid custom component right now:

<style>
/* Assign both height and width to the div that will hold the dgrid */
#grid1 {
    height: 375px;
    width: 750px;
}

/* Assign a default width for all grid cells */
.grid .dgrid-cell {
    width: 80px;
}

/* If you have one or more columnsets then assign them a width. */
.grid .dgrid-column-set-cell {
	width: 50%;
}

</style>

<div id="grid1" class="grid"></div>