【发布时间】：2016-10-03 20:41:29
【问题描述】：
我正在使用道场树网格，以下是要求。我希望网格的子项是可点击的列。不知何故，我设法让每个单元格的第一个孩子成为可点击的列。但是，如果一列有多个子项，则它会使该列下的第一个或最后一个可单击。我附上了图片供您参考，下面是代码
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" href="dojo/dijit/themes/soria/soria.css" />
<link rel="stylesheet" href="dojo/dojo/resources/dojo.css" />
<link rel="stylesheet" href="dojo/dojox/grid/resources/soriaGrid.css" />
<link rel="stylesheet" href="dojo/dojox/grid/resources/Grid.css" />
<style type="text/css">
#grid {
width: 100%;
height: 20em;
}
</style>
</head>
<body clas="claro">
<h1 id="greeting">Hello</h1>
<div id="gridDiv"></div>
<script type="text/javascript" src="dojo/dojo/dojo.js"
data-dojo-config="async:true">
</script>
<script type="text/javascript">
var queues = [ "Cash Room Manager", "Review Check",
"Corporate Advanced Manager", "Tax and Insurance Manager",
"Sold Loan Manager" ];
formattohyperlink = function(value, index, items, node, model,
inRowIndex) {
for (var i = index; i < node.grid.store._arrayOfTopLevelItems.length; i++) {
var len = node.grid.store._arrayOfTopLevelItems[index].children.length;
console.log("i is "+i +len)
for (var j = len; j >= 0; j--) {
console.log("j is now "+j+node.grid.store._arrayOfTopLevelItems[index].children)
console.log(index +node.grid.store._arrayOfTopLevelItems[index].children[j-1].step);
if (value == node.grid.store._arrayOfTopLevelItems[index].children[j-1].step) {
return "<a href='#'>" + value + "</a>";
} else {
return value;
}
}
}
}
require(
[ 'dojo/dom', 'dojo/dom-construct', 'dojox/grid/TreeGrid',
'dijit/tree/ForestStoreModel',
'dojo/data/ItemFileWriteStore' ],
function(dom, domConstruct) {
var data = {
identifier : 'step',
label : 'step',
items : [ {
step : 'Cash Room',
children : [ {
step : 'Cash Room Manager',
count : '1',
inprogress : '21.00',
pending : '4555'
}, ]
}, {
step : 'Manual Review',
children : [ {
step : 'Review Check',
count : '1',
inprogress : '21.00',
pending : '4555'
}, ]
}, {
step : 'Manager Review',
children : [ {
step : 'Corporate Advanced Manager',
count : '1',
inprogress : '21.00',
pending : '4555'
}, {
step : 'Tax and Insurance Manager',
count : '1',
inprogress : '21.00',
pending : '4555'
}, {
step : 'Sold Loan Manager',
count : '1',
inprogress : '21.00',
pending : '4555'
}, ]
} ]
};
var store = new dojo.data.ItemFileWriteStore({
data : data
});
var model = new dijit.tree.ForestStoreModel({
store : store,
childrenAttrs : [ 'children' ]
});
/* set up layout */
var layout = [ {
name : 'Step',
field : 'step',
width : '30%',
formatter : formattohyperlink
}, {
name : 'Count',
field : 'count',
width : '30%'
}, {
name : 'In-Progress',
field : 'inprogress',
width : '20%'
}, {
name : 'Pending',
field : 'pending',
width : '20%'
} ];
/* create a new grid: */
var grid = new dojox.grid.TreeGrid({
id : 'grid',
treeModel : model,
structure : layout,
autoHeight : true,
}, document.createElement('div'));
/* append the new grid to the div */
dojo.byId("gridDiv").appendChild(grid.domNode);
/* Call startup() to render the grid */
grid.startup();
grid.resize();
/* var greetingNode = dom.byId('greeting');
domConstruct.place('<i> Manju!</i>', greetingNode);
var data = {
identifier : 'step',
label : 'step',
items : [ {
name : 'Q1',childern:[
count : '1',
inprogress : '0',
pending : '0',
held : '0',
warning : '0',
deadline : '0',
oldestitem : '2016-09-28']
} ]
};
var store = new dojo.data.ItemFileWriteStore({data:data});
var model = new dijit.tree.ForestStoreModel({store:store,childrenAttrs:['childern']});
var layout = [ {
name : 'Step',
field : 'step',
width : '30%'
}, {
name : 'Count',
field : 'count',
widht : '30%'
}, {
name : 'In-Progress',
field : 'inprogress',
widht : '30%'
}, {
name : 'Pending',
field : 'pending',
widht : '30%'
}, {
name : 'Held',
field : 'held',
widht : '30%'
}, {
name : 'Warning',
field : 'warning',
widht : '30%'
}, {
name : 'Deadline',
field : 'deadline',
widht : '30%'
}, {
name : 'Oldest Item',
field : 'oldestitem',
widht : '30%'
} ];
var grid = new dojox.grid.TreeGrid({
id:'grid',
treemodel:model,
structure:layout
},document.createElement('div'));
dojo.byId('lazyTreeGrid').appendChild(grid.domNode);
grid.startup(); */
});
</script>
</body>
</html>
【问题讨论】：
-
请忽略注释代码
-
我得到了这个工作......