Dojo -如何将复选框添加为DataGrid中的列

gzjq41n4  于 2022-12-16  发布在  Dojo
关注(0)|答案(1)|浏览(282)

我只是一个新手在Dojo。我有一个数据网格(我只是复制粘贴在另一个教程),我需要的是一个复选框作为一列在这个数据网格。我如何才能实现这一点?感谢提前任何帮助。
下面是我完整的html代码:

<!DOCTYPE html>
<html >
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<link rel="stylesheet"

@ http://ajax.googleapis.com/ajax/libs/dojo/1.7/dijit/themes/claro/claro.css import“js/dojo/dojox/grid/resources/claroGrid.css”;

/*Grid needs an explicit height by default*/
#gridDiv 
{
    left: 500px;
    width: 600px;
    height: 20em;
    margin-left: 200px;
    margin-top: 100px;
    padding: 10px 10px 10px 10px;
    border:3px solid black;
}

#progButtonNode
{
    position: relative;
}
</style>
<script>dojoConfig = {async: true, parseOnLoad: false}</script>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojo/dojo.js">       
</script>
<SCRIPT SRC="js/requiredDojo.js" type="text/javascript"></SCRIPT>

<script>
var grid;
require(['dojo/_base/lang', 'dojox/grid/DataGrid', 'dojo/data/ItemFileWriteStore', 'dojo/dom', 'dojo/domReady!'],
function(lang, DataGrid, ItemFileWriteStore, dom){

/*set up data store*/
var data = {
  identifier: "id",
  items: []
};
var data_list = [
  { col1: "normal", col2: false, col3: 'But are not followed by two hexadecimal', col4: 29.91},
  { col1: "important", col2: false, col3: 'Because a % sign always indicates', col4: 9.33},
  { col1: "important", col2: false, col3: 'Signs can be selectively', col4: 19.34}
];
var rows = 60;
for(var i = 0, l = data_list.length; i < rows; i++){
    data.items.push(lang.mixin({ id: i+1 }, data_list[i%l]));
}
var store = new ItemFileWriteStore({data: data});

/*set up layout*/
var layout = [[
  {'name': 'NAME', 'field': 'id', 'width': '150px'},
  {'name': 'DESC', 'field': 'col2', 'width': '150px'},
  {'name': 'CODE', 'field': 'col3', 'width': '150px'},
  {'name': 'IS ENABLE', 'field': 'col4', 'width': '150px'}
]];

/*create a new grid*/
grid = new dojox.grid.DataGrid({
    id: 'grid',
    store: store,
    structure: layout,
    rowSelector: '20px'});

    /*append the new grid to the div*/
    grid.placeAt("gridDiv");

    /*Call startup() to render the grid*/
    grid.startup();

});
</script>
</head>
<body class="claro">
<div id="gridDiv"></div>
</body>
</html>
h5qlskok

h5qlskok1#

尝试

{
   'name': 'NAME', 'field': 'id', 'width': '150px',
   type: dojox.grid.cells.Bool, editable: true
}

你可以找到更多的细节@
http://dojotoolkit.org/reference-guide/1.9/dojox/grid/DataGrid.html#editing-cells

相关问题