I am trying to get the currently filtered data out of the grid as per this KB article and I want to include the searchbox filters. I do not, however, want to use OnRead but I want to get the grid state on a click of a button and get the filters plus the searchbox filters from it instead.

---

ADMIN EDIT

Here is a sample of getting those filters through the OnRead event without using remote operations - all the data is in the view model (the SourceData field) so this does not change the way operations happen compared to not using OnRead.

@using Telerik.DataSource
@using Telerik.DataSource.Extensions

@( new MarkupString(output) )

<br />
<TelerikButton OnClick="@GetFilters">Get Filters</TelerikButton>


<TelerikGrid Data=@GridData TotalCount=@Total OnRead=@ReadItems
             FilterMode=@GridFilterMode.FilterRow Sortable=true Pageable=true EditMode="@GridEditMode.Inline">
    <GridToolBar>
        <GridSearchBox />
    </GridToolBar>
    <GridColumns>
        <GridColumn Field=@nameof(Employee.ID) />
        <GridColumn Field=@nameof(Employee.Name) Title="Name" />
        <GridColumn Field=@nameof(Employee.HireDate) Title="Hire Date" />
        <GridCommandColumn>
            <GridCommandButton Command="Save" Icon="save" ShowInEdit="true">Update</GridCommandButton>
            <GridCommandButton Command="Edit" Icon="edit">Edit</GridCommandButton>
            <GridCommandButton Command="Delete" Icon="delete">Delete</GridCommandButton>
            <GridCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true">Cancel</GridCommandButton>
        </GridCommandColumn>
    </GridColumns>
</TelerikGrid>

@code {
    TelerikGrid<Employee> GridRef { get; set; }
    string output { get; set; }
    public DataSourceRequest CurrentRequest { get; set; }
    void GetFilters()
    {
        output = string.Empty;


        foreach (var item in CurrentRequest.Filters)
        {
            if (item is FilterDescriptor) // filter row
            {
                FilterDescriptor currFilter = item as FilterDescriptor;
                output += $"field: {currFilter.Member}, operator {currFilter.Operator}, value: {currFilter.Value}<br />";
            }

            if (item is CompositeFilterDescriptor) // filter menu
            {
                CompositeFilterDescriptor currFilter = item as CompositeFilterDescriptor;
                output += $"START nested filter: logical operator: {currFilter.LogicalOperator}, details:<br />";
                // there will actually be 1 or 2 only, this showcases the concept and the types
                foreach (FilterDescriptor nestedFilter in currFilter.FilterDescriptors)
                {

                    output += $"field: {nestedFilter.Member}, operator {nestedFilter.Operator}, value: {nestedFilter.Value}<br />";
                }
                output += "END nested filter<br />";
            }
        }
    }




    public List<Employee> SourceData { get; set; }
    public List<Employee> GridData { get; set; }
    public int Total { get; set; } = 0;

    protected override void OnInitialized()
    {
        SourceData = GenerateData();
    }

    protected async Task ReadItems(GridReadEventArgs args)
    {
        CurrentRequest = args.Request;


        var datasourceResult = SourceData.ToDataSourceResult(args.Request);

        GridData = (datasourceResult.Data as IEnumerable<Employee>).ToList();
        Total = datasourceResult.Total;

        StateHasChanged();
    }

    //This sample implements only reading of the data. To add the rest of the CRUD operations see
    //https://docs.telerik.com/blazor-ui/components/grid/editing/overview

    private List<Employee> GenerateData()
    {
        var result = new List<Employee>();
        var rand = new Random();
        for (int i = 0; i < 100; i++)
        {
            result.Add(new Employee()
            {
                ID = i,
                Name = "Name " + i,
                HireDate = DateTime.Now.Date.AddDays(rand.Next(-20, 20))
            });
        }

        return result;
    }

    public class Employee
    {
        public int ID { get; set; }
        public string Name { get; set; }
        public DateTime HireDate { get; set; }
    }
}

---

Using OnRowDrop works fine but there is no configuration possible to set the column at the end of the grid.

Of course it's a personnal taste but I like to have the all the actions buttons on the right side

If a developer changes the structure of the grid in a new release, such as adding or removing columns, the restore can have very unexpected results.

We get around this by storing a version number with the grid and incrementing that number when we change the grid columns.  If the version number on the grid does not match the version number stored with the state, we don't restore it.

We would like to see this be more of an automatic feature of the grid.

Compare the columns in the saved state with the columns in the Grid declaration. You may need to change the way the Grid columns are declared, according to the the linked documentation. If there is inconsistency between the two collections, strip the column information from the saved state before restoring it.  (This was suggested by Dimo from Telerik in a support ticket)

An alternative would just be to throw away that state when it can't be safely restored.

I'd like for someone to be able to select all of the rows in a particular group. The main selection checkbox will just select all of the rows.

It would be nice if this also worked for sub grouping.

Hello,

I'm having issues trying to figure out how to change values (from the model) when I'm Incell Mode without triggers the OnRead events after.  The actual code is working great since I was able to remove the Incell mode on the OnChangeModel event below,  but OnRead is keeps call after (which I didn't need and slow user experience)

Is there a way to cancel the OnRead ?

 <TelerikGrid OnRead="ReadItems" EditMode="GridEditMode.Incell"
                     @ref="@GridRef">
    <GridColumns>
      <GridEditDropDownColumn Field="Test1" Data="@Eval?.ListEvaluationTypes" Title="Title" Width="130px" OnChange="OnChangeModel" />
    </GridColumns>
</TelerikGrid>

   private TelerikGrid<EvaluationListDTO> GridRef { get; set; }

   protected async Task OnChangeModel(object model)
        {
            var item = (EvaluationListDTO)model;

            var state = GridRef?.GetState();

           //Save in the Database  

                // use the state to remove the edited item (close the editor)
                state.EditItem = null;
                state.OriginalEditItem = null;
                await GridRef.SetStateAsync(state);
        }

I am using a ui framework that has some elements on the body with z-indexes > 1000. Eg a side menu. I am using the Telerik Grid. The Column Menus use the animation container, and because the animation containers get placed directly on the body with a z-index of 2, they always appear behind this side menu.

I want to be able to set a CSS to the main wrapping element of the Column Menu (<div class="k-animation-container>), so I can specifically set the z-index for only Column Menu instances of the animation container. 

Please expose the current data of the Grid and TreeList when using Data or OnRead. This will spare the need to cache data for the second time in-memory, or repeat all data operations. The benefit is that the app can:

• Know what data items the user is seeing.
• Obtain the data it its current shape / state.

There should be a way to provide the Format for filtering of DateTime columns.
If a DateTime column has the format "dd.MM.yyyy" filtering for "EQUALS 01.01.2021" does not show lines with the timestamp "01.01.2021 01:00" but the user would expect to see this line.

Regards,
René

Right now you can create a template in the grid to display text from a list based on the foreign key in the grid data. For example, if your database has a table user list and a table role. The Role table has an integer Id primary key column and a text Description column. The user table has a foreign key integer column that is the Role Id. You can bring all the data over when you call up the data (flattening the data) or you can just bring over the foreign key integer value for the role and then create templates.

The situation is described here:

https://docs.telerik.com/blazor-ui/knowledge-base/grids-foreign-key

When you do not flatten the data, you would need to retrieve the role collection and then reference that data in templates in the grid. You need a template for the grid itself, a template for filtering, and a template for the grouping. Maybe more that I am not finding?

What would be great is if you could simply set the foreign key collection for the column and not have to create any templates. You would have to also set what the Id and display text fields are on the collection also so the grid would know what data to use for finding and displaying the desired data. You could require a standard collection with standard field names and then we would have to project the values into it from our other collections using linq.

Hi, please expose a property in TelerikGrid where we can set the number of virtual columns to load in advance. A lot of times we would like to load data in advance for 5-10 columns left & right of the current viewport, so the user doesn't see empty columns while scrolling. This may apply to rows as well. It would be very helpful to have this property, please consider exposing it. Thank you.

============

ADMIN EDIT

============

The column Virtualization feature improves the Grid performance when it has a lot of columns. This does not include loading data on demand, but rather UI virtualization. All the data is retrieved and the performance optimization is achieved by rendering only the columns for the current Grid viewport. When the user scrolls horizontally the content for the other columns is rendered and while this happens, the cells appear empty. The requested parameter will control the number of columns that will be rendered in the current viewport but will not be visible until the user scrolls. Thus, the user will not see empty columns.

When storing and restoring grid state, the selected page size is not included as part of that state currently, and needs to be stored seperately.

(When using GridPagerSettings, the user can select the page size based on inputs provided to PageSizes param. This selection is not synced and will revert to default each time the grid is loaded.