1. Home
  2. Forum
  3. Blazor
  4. Custom sort on grid column

Custom sort on grid column

I have a column bound to a string field in my model that contains alphanumeric data such as ToE1, ToE2, ToE3 etc. I'd like to sort the column in numeric order rather than alphanumeric order. In my model I also have a non bound field that contains the numeric element of the string field. Is it possible to implement a custom sort that uses the non bound numeric field rather than the bound alphanumeric field?

13 Replies 1 reply marked as answer
RS Renjith Singh Rajendran Syncfusion Team September 30, 2020 12:38 PM UTC

Hi Michael, 

Greetings from Syncfusion support. 

We suggest you to handle the custom sorting codes in the OnActionBegin event of Grid. Based on the RequestType as Sorting handle the custom sorting action and update the DataSource property value in Grid. Please refer the documentations below, 

Please refer the codes below, 

 
<GridEvents OnActionBegin="OnActionBegin" TValue="Order"></GridEvents> 

public void OnActionBegin(ActionEventArgs<Order> args){    if(args.RequestType.ToString() == "Sorting")    {        //Perform your custom sort here        ...    }}

We have prepared a sample based on this scenario. Please download the sample form the link below, 

Please get back to us if you need further assistance. 

Regards, 
Renjith Singh Rajendran 


MA Michael Aston September 30, 2020 03:41 PM UTC

Hi,

Unfortunately the solution doesn't work. If you change your test data to:

Orders = Enumerable.Range(0, 4).Select(x => new Order()
        {
            OrderID = 1000 + x,
            Alphanumeric = (new string[] { "ToE1", "ToE2", "ToE13", "ToE14"})[x],
            Numeric = x,
            Freight = 2.1 * x,
            OrderDate = DateTime.Now.AddDays(-x),
        }).ToList();

you will see that the data is still sorting by alpha rather than numeric.

What seems to be happening is that the list is ordered numerically in the OnActionBegin but is then resorted with an alpha sort before the Grid is refreshed. I tried it in the OnActionComplete with the same result.

Interestingly the sort has three visual states :
Arrow Up : args.Direction.ToString() == "Ascending"
Arrow Down : args.Direction.ToString() == "Descending"
Arrow Cleared : args.Direction.ToString() == "Ascending"

On the third state "Arrow Cleared" the numeric sort is presented in the Grid, implying that the grid default alpha sort did not run for this state,

Mike

RS Renjith Singh Rajendran Syncfusion Team October 1, 2020 11:32 AM UTC

Hi Mike, 

Thanks for your update. 

Based on this scenario, we suggest you to use the Custom Way of binding data to Grid and handle the Sort action based on your requirement in the Read method. Please refer the below documentation for more details regarding this feature. 

We have also prepared a sample for your convenience. Please download the sample form the link below, 
 
Please use the below code in handling sort action Read method, 

 
public class CustomAdaptor : DataAdaptor 
    { 
        public override object Read(DataManagerRequest dm, string key = null) 
        { 
            IEnumerable<Order> DataSource = Orders; 
            ... 
            if (dm.Sorted != null && dm.Sorted.Count > 0) 
            { 
                // handle your custom Sorting action here 
                if (dm.Sorted[0].Name == "Alphanumeric") 
                { 
                    dm.Sorted[0].Name = "Numeric";          //Change the column name to Numeric when sorting Alphanumeric column
                } 
                DataSource = DataOperations.PerformSorting(DataSource, dm.Sorted); 
            } 
            ... 
            return dm.RequiresCounts ? new DataResult() { Result = DataSource, Count = count } : (object)DataSource; 
        } 
    } 


Please get back to us if you need further assistance. 

Regards, 
Renjith Singh Rajendran 


MA Michael Aston October 1, 2020 02:14 PM UTC

Hi,

Implemented this with the DataAdaptor approach but run into a problem. My datasource is a IEnumerable<ExpandoObject> and I think this is causing a problem for the PerformSorting function. I can confirm that I have verified that TOE_ID is present in the DataSource.




Mike

RS Renjith Singh Rajendran Syncfusion Team October 2, 2020 12:17 PM UTC

Hi Mike, 

Thanks for your update. 

Based on this scenario, we suggest you to use OrderBy, OrderByDescending methods instead of PerformSorting method to overcome the problem you are facing. Please refer and add the below codes in your application. 

 
if (dm.Sorted != null && dm.Sorted.Count > 0) 
{ 
    // Sorting 
    if (dm.Sorted[0].Name == "Alphanumeric") 
    { 
        dm.Sorted[0].Name = "Numeric";        //Change the column name to Numeric when sorting Alphanumeric column 
    } 
    if (dm.Sorted[0].Direction == "ascending") 
    { 
        DataSource = DataSource.OrderBy(X => ((IDictionary<string, object>)X)[dm.Sorted[0].Name]); 
    } 
    else 
    { 
        DataSource = DataSource.OrderByDescending(X => ((IDictionary<string, object>)X)[dm.Sorted[0].Name]); 
    } 
} 


We have also modified the sample based on this scenario. Please download the modified sample form the link below, 
 
Please get back to us if you need further assistance. 

Regards, 
Renjith Singh Rajendran 


MA Michael Aston October 6, 2020 08:02 AM UTC

Hi,

Any news on this? Looks like the Expando object is not being cast to dynamic before its referenced in PerformSorting.

Mike

RS Renjith Singh Rajendran Syncfusion Team October 7, 2020 01:31 PM UTC

Hi Mike, 
 
Thanks for your update. 
 
We suggest you to use the below codes in Read method to perform sort using PerformSorting method in Grid bind with ExpandoObject. Please refer and use as like the codes below, 
 
 
        public override object Read(DataManagerRequest dm, string key = null) 
        { 
            IEnumerable DataSource = Orders; 
            if (dm.Sorted != null && dm.Sorted.Count > 0) 
            { 
                if (dm.Sorted[0].Name == "Alphanumeric") 
                { 
                    dm.Sorted[0].Name = "Numeric";        //Change the column name to Numeric when sorting Alphanumeric column 
                } 
                DataSource = DynamicObjectOperation.PerformSorting(DataSource.AsQueryable(), dm.Sorted); 
            } 
            ... 
        } 
 
 
We have also prepared a sample based on this scenario. Please download the sample from the link below, 
 
Please get back to us if you need further assistance. 
 
Regards, 
Renjith Singh Rajendran 


Marked as answer
MA Michael Aston October 7, 2020 04:27 PM UTC

That's fixed it.

Many thanks
Mike

RS Renjith Singh Rajendran Syncfusion Team October 8, 2020 12:50 PM UTC

Hi Mike, 

Thanks for your update. 

We are glad to hear that the provided suggestion helped you in achieving this requirement. 

Please get back to us if you need further assistance. 

Regards, 
Renjith R 


MA Michael Aston October 8, 2020 02:27 PM UTC

Hi,

Sorry spoke too soon. I've now run into a problem with the search. The PerfornSearching runs but when the datasource is used to calculate the count a System.NullReference exception is thrown.

public override object Read(DataManagerRequest dm, string key = null)
            {
                IEnumerable DataSource = targetOfEvaluations;

                if (dm.Search != null && dm.Search.Count > 0)
                {
                    // Searching
                    DataSource = DynamicObjectOperation.PerformSearching(DataSource.AsQueryable(),  dm.Search);
                }
                if (dm.Sorted != null && dm.Sorted.Count > 0)
                {
                    // Change the column name from TOE_ID to SystemItemReferenceID to get numeric sorting on TOE_ID
                    if (dm.Sorted[0].Name == "TOE_ID")
                    {
                        dm.Sorted[0].Name = "SystemItemReferenceID";
                    }
                    DataSource = DynamicObjectOperation.PerformSorting(DataSource.AsQueryable(), dm.Sorted);
                }
                if (dm.Where != null && dm.Where.Count > 0)
                {
                    // Filtering
                    DataSource = DataOperations.PerformFiltering(DataSource, dm.Where, dm.Where[0].Operator);
                }
                int count = DataSource.Cast<ExpandoObject>().Count();
                if (dm.Skip != 0)
                {
                    //Paging
                    DataSource = DataOperations.PerformSkip(DataSource, dm.Skip);
                }
                if (dm.Take != 0)
                {
                    DataSource = DataOperations.PerformTake(DataSource, dm.Take);
                }
                return dm.RequiresCounts ? new DataResult() { Result = DataSource, Count = count } : (object)DataSource;
            }

Mike

RS Renjith Singh Rajendran Syncfusion Team October 9, 2020 08:55 AM UTC

Hi Mike, 

Thanks for your update. 

We tried reproducing the reported problem by modifying the sample based on your shared codes and perform Search operation in Grid. But Grid searching works fine from our side, and we could not face any exception when try searching in Grid. 

We are attaching the sample for your reference. Please download the sample from the link below, 

If you are still facing difficulties, then the following details would be helpful for us to proceed further on this and provide you a solution. 
  1. Share with us a sample which you have tried from your side.
  2. Share the exact scenario or proper replication procedure to reproduce the problem.
  3. Share the video demo showing the replication procedure of the problem and error details you are facing.
  4. If possible reproduce the problem with the attached sample, and share with us for further analysis.

The provided information will help us analyze the problem, and provide you a solution as early as possible. 

Regards, 
Renjith Singh Rajendran 


MA Michael Aston October 11, 2020 08:37 PM UTC

Hi,

Located the problem in our code in the generation of the expandoobjects from dapper, so issue is resolved.

Thanks
Mike

RS Renjith Singh Rajendran Syncfusion Team October 12, 2020 02:25 PM UTC

Hi Mike,  
 
Thanks for your update.  
 
We are glad to hear that your problem has been resolved. 
 
Please get back to us if you need further assistance.  
 
Regards,  
Renjith R  
 


Loader.
Up arrow icon