sorting Dojo EnhancedGrid requires user to click narrow area near edge of header

StackOverflow https://stackoverflow.com/questions/17693275

Question

Whenever I create a EnhancedGrid in Dojo, I find that it is difficult to sort. I do not get this problem with an ordinary DataGrid.

Sorting requires me to click inside the column header, but only in a narrow region near the edge of the header. I highlighted this region in green in the below picture. For some headers that are only 1 line high, this region is much smaller and more difficult to click.

column header

When I click in the blue region instead, my mouse simply turns into the re-size icon, even though I'm not clicking on the edge of the cell. Setting "noresize: true" for each cell prevents this problem, but I don't want to stop the user from resizing columns.

Does anyone know how to make it so the user can click anywhere in the header in order to sort?

Thank you!
Tristan

Was it helpful?

Solution

You can click everywhere in the Header to sort a column, not just in the narrow region near the edge of the header.

Check this out : http://dojotoolkit.org/reference-guide/1.8/dojox/grid/EnhancedGrid.html#dojox-grid-enhancedgrid

Update1:

Maybe it's a bug - i found a report here: https://bugs.dojotoolkit.org/ticket/17086 So I would give it a try and load the scripts from an extern Source like in the fiddler example.

Please can you explain why you load your dojoConfig with the number "1" exept the Parameter true? Never seen this befor. I thought this where Boolen only. Try to set the config to the header like:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Demo: Layout with Dijit</title>
<script type="text/javascript">
    var dojoConfig = {
        parseOnLoad: true,
        isDebug: true,
        locale: 'en-us',
        extraLocale: ['ja-jp']
    };
</script>

and the load your dojo files. 

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.8/dojo/dojo.js"></script>
</head>

Also i would add data-dojo-type="dojox.grid.EnhancedGrid" to your Div-Area

<div id="file-table" data-dojo-type="dojox.grid.EnhancedGrid" style="width: 100%; height: 700px;"></div>

Regards

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top