When using sort on a enhanced grid it freezes the browser on mac osx 10.5.8. This has been tested on Safari Version 4.0.5 (5531.22.7) and Firefox Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.2) Gecko/20100115 Firefox/3.6.
Please see my code below. It loads fine until i try to sort any of the columns then it freezes in worst case. If it doesn't freeze then the radio buttons to select are gone.
<style type="text/css">
<!--
@import url("/js/bdojo/dojox/grid/enhanced/resources/siteadminEnhancedGrid.css");
@import url("/js/dojo/dojox/grid/enhanced/resources/EnhancedGrid_rtl.css");
-->
</style>
<script type="text/javascript">
dojo.require("dojox.grid.EnhancedGrid");
dojo.require("dijit.Dialog");
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dojox.grid.enhanced.plugins.IndirectSelection");
dojo.declare("dojox.grid.formatterScopeObj", null, {
store: null,
constructor: function(kwArgs){
this.store = kwArgs.store;
},
fmtLeftOrange: function(value,idx){
return '<div style="text-align:left;color:#D16200;font-weight:normal;">' + value + '</div>';
},
fmtOrange: function(value, idx){
return '<div style="color:#D16200;font-weight:normal;">' + value + '</div>';
},
fmtCheckbox: function(value, idx){
return '<input id="chkRow_' + idx + '" name="chkRow_' + idx + '" type="checkbox">';
}
});
dojo.addOnLoad(function(){
dojo.connect(window, "onresize", resizeGrid);
var layoutCategories = [{
defaultCell: { width: 8, editable: false },
rows: [
[{
field: "titel",
name: "<?= $this->translate("Titel")?>",
width: '55%',
formatter: "fmtLeftOrange"
},
{
field: "datum",
name: "<?= $this->translate("Datum")?>",
width: '25%',
formatter: "fmtOrange"
},
{
field: "auteur",
name: "<?= $this->translate("Auteur")?>",
width: '15%',
formatter: "fmtOrange"
}]
]
}];
var store = new dojo.data.ItemFileReadStore({url: "/siteadmin/blog/blogitems"});
var grid = new dojox.grid.EnhancedGrid({
store: store,
id: "griddiv",
structure: layoutCategories,
formatterScope: new dojox.grid.formatterScopeObj({store: store}),
autoHeight: true,
plugins: {
indirectSelection: {
width: "20px",
styles: "text-align: center;",
position: "right"
}
},
style: "width: 100%;overflow:hidden;",
position: "right",
onRowClick: function(e){
var item = this.getItem(e.rowIndex);
var id = item.id;
//href.location = /
}
}, dojo.byId('griddiv'));
grid.startup();
function resizeGrid() {
// do whatever you need here, e.g.:
grid.resize();
//grid.update();
}
});
</script>
<div id="griddiv"></div>
Data i receive back