control-freak-ide/build/electron-template/tests/functional/KeyboardTab.html
plastic-hub-dev-node-saturn 538369cff7 latest
2021-05-12 18:35:18 +02:00

72 lines
1.3 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test Keyboard Mixin with Tab key</title>
<link rel="stylesheet" href="../../../css/dgrid.css">
<style>
.functionalTest .dgrid {
height: 300px;
width: 400px;
margin: 20px;
}
</style>
</head>
<body class="functionalTest">
<button id="showHeaderButton" tabindex="0">Show Header</button>
<div id="grid1"></div>
<div id="grid2"></div>
<script src="../../../../dojo/dojo.js" data-dojo-config="async: true"></script>
<script>
var ready;
require([
'dojo/_base/declare',
'dgrid/Grid',
'dgrid/Keyboard',
'dgrid/List',
'dojo/on'
], function (declare, Grid, Keyboard, List, on) {
var i;
var data;
var button = document.getElementById('showHeaderButton');
var KeyboardGrid = declare([Grid, Keyboard]);
var grid1 = new KeyboardGrid({
showHeader: true,
columns: {
id: 'ID',
value: 'Value'
}
}, 'grid1');
data = [];
for(i = 0; i < 10; i++) {
data.push({id: i, value: 'Value ' + i});
}
grid1.renderArray(data);
var grid2 = new KeyboardGrid({
showHeader: false,
columns: {
id: 'ID',
value: 'Value'
}
}, 'grid2');
data = [];
for(; i < 20; i++) {
data.push({id: i, value: 'Value ' + i});
}
grid2.renderArray(data);
button.focus();
on(button, 'click', function () {
grid2.set('showHeader', true);
button.focus();
});
ready = true;
});
</script>
</body>
</html>