Selecting of Grid items by ID with CustomAdaptor

Hello,

I want to select one/some entries of a DataGrid by ID that is a route parameter AND using a CustomAdaptor.

Route parameter is working, CustomAdpator Read is working, too!

So how the datagrid can select the object with this ID? Must be working with Paging because I have a huge amount of entries! And the data a generated on serverside by a controller.


Thx much for further help!


7 Replies

MS Monisha Saravanan Syncfusion Team January 13, 2022 11:39 AM UTC

Hi Bernd, 

Greetings from Syncfusion support. 

We have analyzed your query and we suspect that you want to select the DataGrid one entry/some entries by its ID irrespective of the position in Grid. If yes, we suggest you to achieve your requirement using below solution. We have checked the ID value (in the example we have considered the ordered value) from the current view record and if it doesn’t exist we have used GoToPage method to navigate next pages until we got exact record value and SelectRow() method will select the particular record. We had prepared an sample based on your requirement. Kindly check the attached code snippet sample for your reference. 

 
<SfButton OnClick="DataHandler" Content="Navigate"></SfButton> 
<SfGrid TValue="Order" ID="Grid" @ref="Grid" AllowSorting="true" AllowFiltering="true" AllowPaging="true"> 
    <SfDataManager AdaptorInstance="@typeof(CustomAdaptor)" Adaptor="Adaptors.CustomAdaptor"></SfDataManager> 
    <GridPageSettings PageSize="8"></GridPageSettings> 
    <GridEditSettings AllowEditing="true" AllowDeleting="true" AllowAdding="true" Mode="@EditMode.Normal"></GridEditSettings> 
    <GridColumns> 
 
    </GridColumns> 
</SfGrid> 
 
@code{ 
    public static List<Order> Orders { get; set; } 
    public SfGrid<Order> Grid { get; set; } 
    public bool ContinuePaging = true; 
    public bool InitialRender { get; set; } 
    public int Value = 1015; 
    public async Task DataHandler() 
    { 
        ContinuePaging = true; 
        var CurrentPage = Grid.PageSettings.CurrentPage; 
        await Grid.GoToPage(CurrentPage); 
        var PageCount = Grid.PageSettings.PageCount - 1; 
        for (int i = 1; i <= PageCount; i++) 
        { 
            List<Order> Rows = await Grid.GetCurrentViewRecords(); // returns the current view data 
            for (int j = 0; j < Grid.PageSettings.PageSize; j++) 
            { 
                if (j < Rows.Count && Rows[j].OrderID == Value) 
                { 
                    await Grid.SelectRow(j); 
                    ContinuePaging = false; // prevent the default navigation 
                    break; 
                } 
            } 
            if (ContinuePaging) 
            { 
                if (i >= PageCount) 
                { 
                    i = 0; 
                } 
                await Grid.GoToPage(i + 1); 
                await Task.Delay(200); 
 
            } 
        } 
 
    } 


Kindly try the above suggestions and if we have misunderstood your requirement or you are still facing difficulties then kindly revert us for further queries. 

Regards, 
Monisha S 




BP Bernd Parchmann January 13, 2022 12:06 PM UTC

Thx for fast reply! 


But this solution is impossible because of the huge amount of grid entries and the amount of pages!

In our project the grid has > 20k entries and the amount of pages is ~1k!


I guess I have already tested this solution! Every switch of the page the data are collected from the controller! If the element wanted to be selected is on one of the last pages the algorithm is at least 1k * 200ms plus the time to build the data on the controller! -> I dont want to wait > 3min ;)


The best would to be able to inform the adaptor by ReadAnsyc with some additional information: item index and page index. I have already tested this and its working if I send the ID to the controller by route parameter. But the adaptor is firstly collecting the data of the first page and then switching to the calculated page and index of the item (calculated by controller and send to client as property in a container for the result).

I want to be able to avoid the first step (getting the default first page data) if a component parameter (ID) is set!


That is my current solution:


private async void DataBound(object args) // DataBound handler event

      {

         if (ID != 0)

         {

            ID = 0;

            await portGrid.GoToPage(MappingSourcePortAdaptor.SelectedItemPage);

            await portGrid.SelectRow(MappingSourcePortAdaptor.SelectedItemIndex);

            await portGrid.ScrollIntoViewAsync(rowIndex: MappingSourcePortAdaptor.SelectedItemIndex);

         }

      }

public override async Task<object> ReadAsync(DataManagerRequest dm, string key = null)

      {

         var container = await LoHiService.GetAllPorts(dm, SelectedId); // method to get items from controller

         SelectedItemPage = container.SelectedItemPage;

         SelectedItemIndex = container.SelectedItemIndex;

         var dr = new DataResult<LoHiPort>() { Count = container.ItemsCount, Result = container.LoHiItems };

         var dataResult = GroupData(dm, dr);


         return dm.RequiresCounts ? dataResult : (object)dataResult.Result;

      }





BP Bernd Parchmann January 13, 2022 01:10 PM UTC

await portGrid.ScrollIntoViewAsync(rowIndex: MappingSourcePortAdaptor.SelectedItemIndex);

is not working because virtualization is not set to true and cannot be set to true because grouping is needed! Is there another solution that is working (no JS!)?



RS Renjith Singh Rajendran Syncfusion Team January 14, 2022 07:18 AM UTC

Hi Bernd, 
 
Query : Is there another solution that is working (no JS!)? 
We are checking this scenario from our side. We will update you further details within two business days. Until then we appreciate your patience. 
 
Query : ScrollIntoViewAsync(rowIndex: MappingSourcePortAdaptor.SelectedItemIndex); is not working because virtualization is not set to true 
It is a must to enable virtualization in grid when using ScrollIntoViewAsync. Please refer the below documentation for more details, 
 
Regards, 
Renjith R 



MS Monisha Saravanan Syncfusion Team January 18, 2022 02:12 PM UTC

Hi Bernd,  

Thanks for the patience.  

Query: “I want to be able to avoid the first step (getting the default first page data) if a component parameter (ID) is set! 

We suggest you to define the CurrentPage property of GridPageSettings to resolve your query. Previously you have called GotoPageAsync method in DataBound event of Grid which will be triggered once data is bound to Grid. Hence the initial call is made with default settings.  
                                                                     
So we suggest you to define the CurrentPage property of GridPageSettings to render the Grid with specific page as first page. Refer the below code example.  

<SfGrid TValue="Order" ID="Grid" @ref="portGrid" AllowSorting="true" AllowFiltering="true" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Delete", "Update", "Cancel" })"> 
    <SfDataManager AdaptorInstance="@typeof(CustomAdaptor)" Adaptor="Adaptors.CustomAdaptor"></SfDataManager> 
    <GridPageSettings CurrentPage="@CurrentPage" PageSize="50"></GridPageSettings> 
    <GridEvents TValue="Order" DataBound="DataHandler"></GridEvents> 
    <GridEditSettings AllowEditing="true" AllowDeleting="true" AllowAdding="true" Mode="@EditMode.Normal"></GridEditSettings> 
    <GridColumns> 
        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true" TextAlign="@TextAlign.Center" Width="140"></GridColumn> 
        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn> 
        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Width="150"></GridColumn> 
    </GridColumns> 
</SfGrid> 
 
@code { 
    public static List<Order> Orders { get; set; } 
    public SfGrid<Order> portGrid { get; set; } 
    public bool ContinuePaging = true; 
    public bool InitialRender { get; set; } 
    public double ID { get; set; } = 10; 
    public int CurrentPage { get; set; } = 5; 
    public async Task DataHandler() 
    { 
        if (ID != 0) 
        { 
            ID = 0;             
            await portGrid?.SelectRow(4); 
        } 
    } 

Query: “Is there another solution that is working (no JS!)? 

We would like to inform you that, We have considered this as a usability improvement and logged a feature task “Need to select Grid Items based on ID for Custom Adaptor” for this requirement. We are always trying to make our products better and feature requests like yours are a key part of our product growth efforts. At the planning stage for every release cycle, we review all open features and identify features for implementation based on specific parameters including product vision, technological feasibility, and customer vote count.   
   
We do not have immediate plan to implement this feature and it will be included in any of our upcoming releases. Please cast your vote to make it count. You can track the current status of your request using the below feedback page. 
 

Till then we suggest you to achieve your requirement using JavaScript solution.  

Regards, 
Monisha  



BP Bernd Parchmann January 18, 2022 05:20 PM UTC

Unfortunately your proposal may not work - or just working with the same problem that the first adaptor call is to get the index of the page and row!

The content of the table can be changed after I have stored the page index! So its possible that the saved page index may be not correct anymore!

Or am I wrong?



VN Vignesh Natarajan Syncfusion Team January 19, 2022 12:42 PM UTC

Hi Bernd,  
 
Query: “Unfortunately your proposal may not work - or just working with the same problem that the first adaptor call is to get the index of the page and row! 
 
In this update, you have requested to avoid first step of Getting the default page data when component parameter ID is set. Also we found that you have called GotoPageAsync method in DataBound event to move to specific page. DataBound event will be triggered when datasource is bound to Grid component. So calling the GotoPageAsync method will in DataBound will look like two request is made during the required operations. One is during the initial rendering and second time while calling GotoPageAsync.  
 
So we have provided CurrentPage property to render the Grid component with specific page index. We suggest you to use MappingSourcePortAdaptor.SelectedItemPage property value from await portGrid.GoToPage(MappingSourcePortAdaptor.SelectedItemPage); of DataBound to resolve this query.  
 
If above solution does not resolve your query or if we misunderstood your requirement, kindly share more details about he issue you are facing. It will be very helpful for us to validate the reported query at our end and provide solution as early as possible.       
 
Regards, 
Vignesh Natarajan. 


Loader.
Up arrow icon