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

.Net 7 upgrade breaks Grid ordering

Hi
I have Blazor Server app which uses Syncfusion Blazor 19.3.0.54.  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

TIA

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 05:26 PM UTC

Hi

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

TIA



IG Indy Gill November 10, 2022 05:38 PM UTC

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?

TIA




IG Indy Gill November 11, 2022 10:44 AM UTC

Hi

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 14, 2022 04:01 AM UTC

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.


<head>

    <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" />

</head>


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

https://blazor.syncfusion.com/documentation/common/adding-script-references#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. 


Regards,

Sarveswaran PK



Loader.
Live Chat Icon For mobile
Up arrow icon