#798: Grid default loading placeholder updates + row selection relate…

…d updates (#800)
vikramlearning · Jul 12, 2024 · 297e154 · 297e154
1 parent 69a51c6
commit 297e154
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 8 deletions.
diff --git a/blazorbootstrap/Components/Grid/Grid.razor b/blazorbootstrap/Components/Grid/Grid.razor
@@ -85,8 +85,10 @@
                 {
                     @if (loadingTemplate is null)
                     {
+                        var placeholderRowCount = AllowPaging ? pageSize : (totalCount < 10 ? totalCount : 10);
+
                         // show placeholders
-                        @for (var i = 0; i < 5; i++)
+                        @for (var i = 0; i < placeholderRowCount; i++)
                         {
                             <tr>
                                 @for (var j = 0; j < columnCount; j++)

diff --git a/blazorbootstrap/Components/Grid/Grid.razor.cs b/blazorbootstrap/Components/Grid/Grid.razor.cs
@@ -258,7 +258,7 @@ private RenderFragment ChildSelectionTemplate(int rowIndex, TItem rowData) =>
             builder.AddAttribute(103, "class", $"form-check bb-grid-form-check-{headerCheckboxId}");
 
             builder.OpenElement(104, "input");
-            builder.AddAttribute(105, "class", "form-check-input");
+            builder.AddAttribute(105, "class", "form-check-input bb-grid-form-check-input");
             builder.AddAttribute(106, "type", "checkbox");
             builder.AddAttribute(107, "role", "button");
 

diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.css b/blazorbootstrap/wwwroot/blazor.bootstrap.css
@@ -141,16 +141,16 @@ table button.dropdown-toggle.bb-grid-filter::after {
     --bs-table-bg: inherit !important;
 }
 
-    .bb-table tr:has(input[type=checkbox]:checked) {
+    .bb-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked) {
         color: var(--bb-table-selected-row-color);
         background-color: var(--bb-table-selected-row-background-color);
     }
 
-        .bb-table tr:has(input[type=checkbox]:checked):hover,
-        .bb-table tr:has(input[type=checkbox]:checked):hover > * {
-            color: var(--bb-table-selected-row-hover-color);
-            background-color: var(--bb-table-selected-row-hover-background-color);
-        }
+    .bb-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked):hover,
+    .bb-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked):hover > * {
+        color: var(--bb-table-selected-row-hover-color);
+        background-color: var(--bb-table-selected-row-hover-background-color);
+    }
 
 .bb-table-sticky {
     border-collapse: collapse;