-
Notifications
You must be signed in to change notification settings - Fork 0
/
grid.js
50 lines (43 loc) · 1.54 KB
/
grid.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
let rows = 100;
let cols = 26;
let addressColCont = document.querySelector(".address-col-cont");
let addressRowCont = document.querySelector(".address-row-cont");
let cellsCont = document.querySelector(".cells-cont")
let addressBar = document.querySelector(".address-bar")
for (let i = 0; i < rows; i++) {
let addressCol = document.createElement("div");
addressCol.setAttribute("class", "address-col");
addressCol.innerText = i + 1;
addressColCont.appendChild(addressCol);
}
for (let i = 0; i < cols; i++) {
let addressRow = document.createElement("div");
addressRow.setAttribute("class", "address-row");
addressRow.innerText = String.fromCharCode(65 + i);
addressRowCont.appendChild(addressRow);
}
for (let i = 0; i < rows; i++) {
let rowCont = document.createElement("div")
rowCont.setAttribute("class","row-cont")
for (let j = 0; j < cols; j++)
{
let cell = document.createElement("div")
cell.setAttribute("class","cell")
cell.setAttribute("contenteditable","true")
cell.setAttribute("spellcheck","false");
// rid and cid attributes for identification for storage purpose
cell.setAttribute("rid",i);
cell.setAttribute("cid",j);
rowCont.appendChild(cell)
addListenerForAddressBarDisplay(cell,i,j)
}
cellsCont.appendChild(rowCont)
}
function addListenerForAddressBarDisplay(cell,i,j)
{
cell.addEventListener("click",(e)=>{
let rowID = i+1
let colID = String.fromCharCode(65+j)
addressBar.value = `${colID}${rowID}`
})
}