“Delay in cell selection” problem - select multiple cells in table with Ctrl+ key -> style reflection only taking too much time #10686

Prerequisites

Please answer the following questions before submitting an issue. YOU MAY DELETE THE PREREQUISITES SECTION.

• What is your product version? 10.2
• What is your product type (Angular or MVC)? Angular
• What is product framework type (.net framework or .net core)? .net core

If issue related with ABP Framework

• What is ABP Framework version?

If issue is about UI

• Which theme are you using? Default
• What are the theme settings? Default

Hi, I've a problem, that I want to mark multiple cells (of for ex. a table) and add style (orange color) to it. It is working very slow - and we asked some support of a control producer for help.

They find out the following - that is must be an application problem of (ASPZERO?)

"We have checked this issue by adding the HTML table with clickable td element in your application and when we ctrl+click the td element of table we added the ‘custom-class’ to that respective td to change background. The same issue reproducing in that HTML table too. Please refer below Video demo for more information.

Based on our validation ‘custom-class’ class added immediately to the respective element but the style reflection only taking too much time. So please check the issue at your end. "

This is the table - nothing special:

<div id="space" [class]="'kt-grid__item kt-grid__item--fluid'"> <div class="kt-portlet kt-margin-b-0"> <div class="kt-padding-0"> <div id="target" [busyIf]="isSchedulerServiceGettingCalled" [ngStyle]="{'height': schedulerHeight}"> <div [ngClass]="showPlanningNeeds?'height70': (totalRecordsCount > pageSize ? 'height100' : 'height96' )">

                <table class="checkTables">
                    <tr>
                        <td>first</td>
                        <td>second</td>
                    </tr>
                    <tr>
                        <td>first</td>
                        <td>second</td>
                    </tr>
                    <tr>
                        <td>first</td>
                        <td>second</td>
                    </tr>
                </table>

.checkTables td { border: 1px solid gray; }

in ...Host\src\styles.css

Any idea how to fix that?