We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

.Net 7 upgrade breaks Grid ordering

I have Blazor Server app which uses Syncfusion Blazor  I am using the SfGrid control to display a grid which has sorting and work well on .Net 6.  I upgraded my app yeterday to .Net 7 and noticed that the sorting on my grid broke.  Any idea why this maybe.  Do I need to be on a certain version of Syncfusion to use .Net 7?
Below is the error message I get if this helps


ExceptionType: Microsoft.JSInterop.JSException

Exception: Microsoft.JSInterop.JSException: Failed to execute 'querySelectorAll' on 'Element': '##faProblem_Resolution38816' is not a valid selector. Error: Failed to execute 'querySelectorAll' on 'Element': '##faProblem_Resolution38816' is not a valid selector. at Object.ye [as selectAll] (http://localhost/MyApp/_content/Syncfusion.Blazor/scripts/syncfusion-blazor-bfe131.min.js:1:69959) at e.getTargetList (http://localhost/MyApp/_content/Syncfusion.Blazor/scripts/sf-tooltip-bfe131.min.js:1:2501) at e.unwireEvents (http://localhost/MyApp/_content/Syncfusion.Blazor/scripts/sf-tooltip-bfe131.min.js:1:4250) at Object.updateProperties (http://localhost/MyApp/_content/Syncfusion.Blazor/scripts/sf-tooltip-bfe131.min.js:1:28589) at http://localhost/MyApp/_framework/blazor.server.js:1:3506 at new Promise () at Ft.beginInvokeJSFromDotNet (http://localhost/MyApp/_framework/blazor.server.js:1:3480) at Ft._invokeClientMethod (http://localhost/MyApp/_framework/blazor.server.js:1:75072) at Ft._processIncomingData (http://localhost/MyApp/_framework/blazor.server.js:1:72696) at Ft.connection.onreceive (http://localhost/MyApp/_framework/blazor.server.js:1:67009)

at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)

at Syncfusion.Blazor.Popups.SfTooltip.OnParametersSetAsync()

at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)

at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

4 Replies

IG Indy Gill November 10, 2022 12:26 PM


Just to add that I upgraded to Syncfusion and ran under .Net 7 and still got the same error when order the data


IG Indy Gill November 10, 2022 12:38 PM

Okay I think I have identified the problem.  If I upgrade the NuGet package to latest and leave the below Javascript refernces it works (note they are the older references - 19.2.49)

    <link rel='nofollow' href="https://cdn.syncfusion.com/blazor/19.2.49/styles/bootstrap4.css" rel="stylesheet" />

    <script src="https://cdn.syncfusion.com/blazor/19.2.49/syncfusion-blazor.min.js" type="text/javascript"></script>

    <script src="https://github.com/Daddoon/Blazor.Polyfill/releases/download/3.0.1/blazor.polyfill.min.js"></script>

But if I use the Syncfusion Migrate Syncfusion App to another version in Visual Studio (Syncfusion Extension) it changes the above lines to 

  <link rel='nofollow' href="https://cdn.syncfusion.com/blazor/20.3.56/styles/bootstrap4.css" rel="stylesheet" />

  <script src="https://cdn.syncfusion.com/blazor/20.3.56/syncfusion-blazor.min.js" type="text/javascript"></script>

  <script src="https://github.com/Daddoon/Blazor.Polyfill/releases/download/3.0.1/blazor.polyfill.min.js"></script>

Which then gives me an error when filtering and sorting

Is it okay to leave my app on the older Javascript source files?


IG Indy Gill November 11, 2022 05:44 AM


I thought teh below screen shot may help of an error I seem to get when using teh upgrade feature in Visual Studio

Also I think my SF tabs stop working when I use the  19.2.49 scripts with  20.3.56 assemblies

Hope this helps

Attachment: Syncfusion_Error_aec86428.zip

SP Sarveswaran Palani Syncfusion Team November 13, 2022 11:01 PM

Hi Indy,

Sorry for the delay.

Based on your update, we have checked the same scenario at our end, but we’re unable to replicate the reported issue at our end. Before proceeding further kindly share the following details to validate the reported query further at our end.

  1. Share the Screen shot of the exception error while filtering the records

  2. Mention us the rc version of your project

  1. And Suggest you to include script and themes properly in your project. Kindly refer the attached code snippet and UG documentation for your reference.


    <meta charset="utf-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <base rel='nofollow' href="~/" />

    <link rel="stylesheet" rel='nofollow' href="css/bootstrap/bootstrap.min.css" />

    <link rel='nofollow' href="css/site.css" rel="stylesheet" />

    <link rel='nofollow' href="DPSimple.styles.css" rel="stylesheet" />

    <link rel='nofollow' href=https://cdn.syncfusion.com/blazor/20.3.56/styles/bootstrap5.css rel="stylesheet" />

    <script src=https://cdn.syncfusion.com/blazor/20.3.56/syncfusion-blazor.min.js type="text/javascript"></script>

    <component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />


If you are referencing themes or scripts from CDN, Can you please ensure to change the version of reference.

Reference: https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference


4. Share the video demo of an issue

5. Mention the NuGet Version of your current project

6. If possible, share issue reproducible runnable sample to us

Above requested details will be helpful for us to validate the reported query at our end and provide solution as early as possible. 


Sarveswaran PK

Live Chat Icon For mobile
Up arrow icon