Hi there, 

Is it possible to have multi-column headers for the data grid, like we have in Kendo grid. 

if so, what would be the ETA? 

Thanks,

Deepa

Would be helpful to have the feature of copying selected row to the clipboard.

The copy format could be CSV or just tabbed delimiter.

---

ADMIN EDIT

In the meantime, you can consider your own JS-based solution (example StackOverflow thread) and integrate them on a command button in the grid or in the row context menu.

---

I have a simple Grid with custom detail template

    <Telerik.Blazor.Components.TelerikGrid Data="@GridData" FilterMode="Telerik.Blazor.GridFilterMode.FilterRow" >

        <GridColumns>
            <Telerik.Blazor.Components.GridCheckboxColumn Title="Selected"></Telerik.Blazor.Components.GridCheckboxColumn>
            <Telerik.Blazor.Components.GridColumn Title="Name" Filterable="true" Field="@nameof(GridItem.Text)"></Telerik.Blazor.Components.GridColumn>
            <Telerik.Blazor.Components.GridColumn Field="@nameof(GridItem.Date)" Filterable="true" Title="Date"></Telerik.Blazor.Components.GridColumn>
            <Telerik.Blazor.Components.GridColumn Field="@nameof(GridItem.Id)" Filterable="true" Title="Id"></Telerik.Blazor.Components.GridColumn>
            <Telerik.Blazor.Components.GridColumn Field="@nameof(GridItem.ParentIdValue)" Filterable="true" Title="Parent Id"></Telerik.Blazor.Components.GridColumn>
            <Telerik.Blazor.Components.GridColumn Field="@nameof(GridItem.HasChildren)" Filterable="true" Title="Has Children"></Telerik.Blazor.Components.GridColumn>
        </GridColumns>

        <DetailTemplate>
            <div>Custom Template</div>
        </DetailTemplate>

    </Telerik.Blazor.Components.TelerikGrid>

And here is what it looks like. Filters are moved one column to the left. When I remove DetailTemplate everything is ok.

When a column is displayed conditionally, it's order is not preserved. In the code sample below, the ProductId column is the first column in the grid.  When you click the checkbox to hide the column, it is removed.  Click the checkbox again and the column reappears but it is the last column in the grid.

ADMIN EDIT: At the end of this post there is an attachment with a workaround through a custom column chooser.

<input type="checkbox" @onchange="@ToggleColumn" />

<TelerikGrid Data=@GridData>
    <GridColumns>
        @if (ShowColumn)
        {
            <GridColumn Field=@nameof(Product.ProductId) Title="Id" />
        }
        <GridColumn Field=@nameof(Product.ProductName) Title="Product Name" />
        <GridColumn Field=@nameof(Product.UnitPrice) Title="Unit Price">
            <Template>
                @(String.Format("{0:C2}", (context as Product).UnitPrice))
            </Template>
        </GridColumn>
    </GridColumns>
</TelerikGrid>

@code {
    public IEnumerable<Product> GridData { get; set; }
    bool ShowColumn = true;

    protected override void OnInitialized()
    {
        List<Product> products = new List<Product>();
        for (int i = 0; i < 20; i++)
        {
            products.Add(new Product()
            {
                ProductId = i,
                ProductName = "Product" + i.ToString(),
                UnitPrice = (decimal)(i * 3.14)
            });
        }

        GridData = products.AsQueryable();
    }

    private void ToggleColumn(ChangeEventArgs args)
    {
        ShowColumn = (bool)args.Value;
    }

    public class Product
    {
        public int ProductId { get; set; }
        public string ProductName { get; set; }
        public decimal UnitPrice { get; set; }
    }
}

Hi !

How can i hide some columns on small device ?

Telerik.Blazor.Components.GridColumn.Class does not exist ?

Regards,

--------

ADMIN EDIT

This will be done through the Visible parameter of the column. You can bind it to a flag that hides the column for the desired scenarios (resolution, user settings, etc.). The new feature we provide to facilitate this will be a MediaQuery component that lets you have an easy flag in the C# code based on the media query for the desired resolution. There will be a demo how to use it with the grid columns when the 2.23.0 release is live. With this approach you will still use a CSS media query, but this will give you more flexibility to use it in more functionality than just the grid columns, and will avoid adding extra properties to the column.

--------

Please add a feature to export the grid to a PDF file.

---

ADMIN EDIT

We have made two examples you can use for the time being to get a PDF document from the grid:

• server-side export - getting the grid data request and using some application code to generate the file: https://github.com/telerik/blazor-ui/tree/master/grid/pdf-export-server
• client-side export through Kendo libraries in the browser only: https://github.com/telerik/blazor-ui/tree/master/common/pdf-jpg-export-js

---

Is there any way to default the values that are used when I create a new row?

So for example, I have a row where I want to default a date to Jan 1st of the following year.  However, when I add the row, it adds nulls to all fields and the date shows up as 1 Jan 1900 and there's a lot of fiddly clicking to set the right date.

ADMIN EDIT: The following knowledge base article has been updated to explain how to use nested models: https://docs.telerik.com/blazor-ui/knowledge-base/grid-bind-navigation-property-complex-object

At the moment, you must use flat models with primitive types for binding the grid. If you don't, the data source operations break and they can't even display "nested" values. Examples here and here.

I would like to be able to use my complex models so I can point a grid's column to a field like MyModel.MyNestedModel.MyPrimitiveField

My be related to binding to a data table and dynamic expando.

Please allow to set Group By fields at Design time, currently only user has control to Drag and drop to group.

we need feature to group by fixed set of columns and don't allow user to change the grouping, also need option to hide group collapse icons.

Grid column header and content alignment (horizontal +Vertical)

---

ADMIN EDIT

For the time being, this is possible through the CellRender event, see below in the thread for an example.

---

Steps to reproduce:
1.Create a Telerik Grid with SelectionMode=@GridSelectionMode.Multiple and a GridCheckboxColumn to select/unselect the rows. 
Also, bind the selected items to an IEnumerable collection and display the selected items in a <ul>
2.Click on Row1's checkbox - It selects the row, but not checking the checkbox
3.Click on it again- Now it unselects the row, but the checkbox is checked.
4.Click on the SelectAll checkbox in the grid header - It selects all rows, row checkboxes are checked, but the SelectAll checkbox in the grid header remains unchecked.
5.Click on the SelectAll checkbox again - All rows remain selected, row checkboxes remain checked, The SelectAll checkbox is now checked.
6.Click on the SelectAll checkbox again- All rows are unselected, row checkboxes are unchecked, The selectAll checkbox remains checked.

Another issue is, corresponding row checkbox remains checked on moving to next page eventhough the row is not selected. 
For eg,
1. a grid of 20 rows displays 10 items per page; Row 2 is selected and checkbox is checked
2. Move to page 2 - Row 12 checkbox is checked (but row 12 is not selected)

Please note that this discrepancy is only when using a checkbox column, otherwise the grid selection using Ctrl + Click works as expected.

Attached Screenshot of one of the issues

On clicking Row 2 checkbox again, result below

Hello,

I am new to your Blazor UI components.  Please provide a link for exporting a grid to excel.

Thanks,

Earl

How would you remove the icon to expand a detail grid only for certain rows?  Some rows will not have detail data and should not be expandable.

---

ADMIN EDIT

As suggested by Joel, you can use the RowRender event and a bit of CSS to hide the button. Here is a Knolwdge Base article that shows a fully runnable sample: https://docs.telerik.com/blazor-ui/knowledge-base/grid-conditional-expand-button.

    void OnRowRenderHandler(GridRowRenderEventArgs args)
    {
        OrgUnit item = args.Item as OrgUnit;

        args.Class = item.Children.length ? "has-children" : "no-children";
    }

tr.no-children .k-hierarchy-cell *{
    display:none !important;
}