Demos
Basics
Performance
Import
App Ideas
Multiple Grids
You can easily put more than a single DataGridXL instance on your web pages. You can copy cells from one instance and paste them in the other.
Code
<style>
.grid {
height: 320px;
margin-bottom: 2rem;
}
/* DESKTOP STYLES */
@media only screen and (min-width: 768px) {
.grid-container {
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr 1fr;
}
.grid {
margin-bottom: 0;
}
}
</style>
<div class="grid-container">
<div class="grid" id="grid1"></div>
<div class="grid" id="grid2"></div>
<div class="grid" id="grid3"></div>
<div class="grid" id="grid4"></div>
</div>
<script src="https://code.datagridxl.com/datagridxl2.js"></script>
<script>
for(var i = 0; i < 4; i++){
window["grid"+i] = new DataGridXL("grid" + (i+1), {
data: DataGridXL.createDummyData(50,10),
instantCut: true
});
}
</script>
