Hi Michael,

I'm afraid there is no news that we can share.

Currently, the team is focused on the most demanded issues and features, and when they will get the time, they will also look into this one.

Until then, please use the workaround that we provided for this issue.

Regards,
Attila Antal
Progress Telerik

Hello Michael,

You were right, if the Grid renders its first column Hidden, the issue appears again. You can overcome that by applying the workaround in the dataBound event as well. I have updated my post from 2019 with the new workaround. This will cover most if not all scenarios.

We strive to improve our controls by fixing as many issues as we can. When the time comes, our developers will have a look into this and decide their next plans accordingly.

For the moment, we suggest using the workaround.

Thank you for your understanding.

Regards,
Attila Antal
Progress Telerik

Workaround

To work around the issue, you can implement a JavaScript logic that will be executed when a column is hiding or showing. In this event handler, you can remove the left border of the first visible cell.

Here is a Dojo Sample for demonstration: https://dojo.telerik.com/eRAnUyor/5

 [ Update: 2/13/2023 ] 

The earlier workaround only fixed the issue if/when showing and hiding a column. It did not work if the Grid rendered its first column hidden. To fix this, also apply the workaround when the Grid has finished binding to data. That is by using its dataBound event.

dataBound: function (e) {
    var gridElement = e.sender.element;
    // Add the fix when first column hides
    if (!$(gridElement).find('.k-grid-header .k-header:first-child').is(':visible')) {
        // Fix the header
        $(gridElement).find('.k-grid-header .k-header:visible').eq(0).addClass('removeBorderLeft');

        // Fix the rows
        $(gridElement).find('tr').each(function () {
            $(this).find('td:visible').eq(0).addClass('removeBorderLeft');
        });
    }
}

Updated Dojo Sample: https://dojo.telerik.com/ubaLiYEN/9

Summary

In order to improve performance, the Grid uses only CSS to apply styles to the cells instead of implementing JavaScript logic to do the calculations.

.k-filter-row>th:first-child, 
.k-grid tbody td:first-child, 
.k-grid tfoot td:first-child, 
.k-grid-header th.k-header:first-child {
    border-left-width: 0;
}

Whether or not the cell is hidden, the td:first-child applies to the first cell in the row. As a side effect of this approach, the left border is not removed from the first visible cell, hence it gets doubled.

We have logged this issue in our system and can be publicly accessed at: Grid double left-border when first column hidden #5288

Kind regards,
Attila Antal
Progress Telerik