CssClass e-icons e-view-details not showing

[Jeco Jacob]

  <SfGrid DataSource="@GridData" AllowPaging="true" AllowSorting="true" EnableHover="true" ShowColumnChooser="true" Toolbar="@(new List<string>() {"ColumnChooser"})">

      <GridPageSettings PageCount="5"></GridPageSettings>

      <GridColumns>

          <GridColumn Field=@nameof(ParkingItem.ParkingId) HeaderText="Parking Id" TextAlign="TextAlign.Right" Width="80"></GridColumn>

          <GridColumn Field=@nameof(ParkingItem.PlateNumber) HeaderText="Plate Number" Width="80"></GridColumn>

          <GridColumn Field=@nameof(ParkingItem.CustomerName) HeaderText="Customer" Width="170"></GridColumn>

          <GridColumn Field=@nameof(ParkingItem.CustomerAddress) HeaderText="Address" Width="190"></GridColumn>

          <GridColumn Field=@nameof(ParkingItem.Status) HeaderText="Status" Width="100"></GridColumn>

            <GridColumn HeaderText="Pay" TextAlign="TextAlign.Center" Width="150">

              <GridCommandColumns>

                  <GridCommandColumn ButtonOption="@(new CommandButtonOptions() { CssClass="e-icons e-view-details"})" Title="Make Payment"></GridCommandColumn>

              </GridCommandColumns>

          </GridColumn>

      </GridColumns>

  </SfGrid>

[Prathap Senthil]

Hi Jeco Jacob,

Greetings from Syncfusion,

Based on the reported issue, we would like to clarify that to refer to an icon for a button, we recommend using the IconCss property. You have used the CssClass property, but CssClass is primarily used for button styles, such as defining styles and sizes.Kindly refer to the code snippet below for your reference:

            <GridCommandColumns>

                <GridCommandColumn ButtonOption="@(new CommandButtonOptions() { IconCss="e-icons e-bring-to-view", CssClass="e-flat" })" Title="Make Payment"></GridCommandColumn>

            </GridCommandColumns>

        </GridColumn>

Sample: https://blazorplayground.syncfusion.com/embed/rthSZJDCKgkHsvhY?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

Additionally, we noticed that you have used the icon name e-view-details, but this icon does not exist in our current Syncfusion icon library. If you want to use our built-in icons, you only need to add the prefix e- before the icon’s class. Please ensure that you are using an  available icon’s from our library.If you need a different icon, you can use third-party icons based on your requirements.

Icons Library in Blazor - Syncfusion
Icons Library in Blazor - Syncfusion

Note: We recommend checking our Icons List documentation, which provides information on the icons supported in different themes. You can find this information at the following link: https://blazor.syncfusion.com/documentation/appearance/icons#icons-list. Please ensure that the icons you are using are supported in the selected theme

Regards,
Prathap Senthil