Forum | Appery.io

I have a dynamically created grid.

A user can click on the grid and mark a startpoint (cell goes red) and mark an endpoint, cells go red.

The above works.

What I cant figure out in Appery Javascript is how to then fill in all blocks between the start and end point to create a square selection.
Basically I have start row, end row, start column, end column, and from that I want to set the cells background.

I've tried almost every idea on Google with no success....

Can you help please?

Hello Andy,

You can add that functionality with CSS classes: use methods addClass() and removeClass(). Each class has it's own background.

thanks Sergiy, the question was more how I address each individual cell, but I've managed to work it out now;
code
for (var rowct = srow;rowct<=erow;rowct++) {
for (var colct = scol;colct<=ecol;colct++) {
tc = document&#46;getElementById("ScreenBuilder_selectiongrid")&#46;rows[rowct]&#46;cells[colct];
cell = jQuery(tc);
&#47;&#47;Change cell background
cell&#46;css("background", bgcol);
}
}
/code

Glad to hear things are sorted out now!