SfDialogService not working in .NET 8.0

Does SFDialogService work with .NET 8?

I don't get an error message, but nothing pops up.

I added

@inject SfDialogService DialogService

to the top of my razor page

builder.Services.AddScoped<SfDialogService>();

to program.cs

and

<Syncfusion.Blazor.Popups.SfDialogProvider />

to

Mainlayout.razor

Am I missing something? Please advise.

Thanks,

Mike




6 Replies

KP Kokila Poovendran Syncfusion Team April 1, 2024 10:47 AM UTC

Hi Michael Troulis,


Thank you for reaching out to Syncfusion support!


We've reviewed your query regarding the usage of SfDialogService with .NET 8.0, and we'd like to address your concerns.


From the configuration you've provided, it seems you've set up the SfDialogService correctly. However, one potential reason for the dialog not popping up could be a missing script reference.


Ensure that you have included the necessary script references in your project. Here's a sample code snippet that you can include in your HTML file:


<body>

    <Routes @rendermode="RenderMode.InteractiveServer" />

    <script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>

    <script src="_framework/blazor.web.js"></script>

</body>

 


Please verify if this script reference is properly added to your project, as missing it can lead to issues with the functionality of Syncfusion components. Additionally, we've prepared a sample for your reference. You can access it through the attachment provided below.


Video reference: 




If you continue to encounter difficulties, please don't hesitate to reach out. We're here to assist you further.


Attachment: BlazorApp1_3656f474.zip


MT Michael Troulis replied to Kokila Poovendran April 1, 2024 02:55 PM UTC

Thanks for the attachement. It's working now.



AM Andrew Moore May 6, 2024 03:49 AM UTC

I had the same issue in my new app that I created with the Syncfusion template. My App.razor file contained the following line.

<script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>

Updating that line to the following fixed the issue. (i.e. Adding ".Core" to the existing line)

<script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>


Syncfusion - Perhaps the template needs to be updated?



KP Kokila Poovendran Syncfusion Team May 6, 2024 11:48 AM UTC

Hi Michael Troulis,


Thank you for sharing your solution for resolving the issue with the Syncfusion template. We appreciate your feedback.


Regarding your suggestion to update the template, please note that when using the Syncfusion template, it automatically generates individual NuGet references for styles and scripts. Therefore, it's essential to reference the individual NuGet packages for both styles and scripts as follows:


[Individudual Nuget]

<link rel="stylesheet" rel='nofollow' href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" />

<script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>




However, if you are using the common NuGet package, you should refer to the script and style references accordingly:


[Common Nuget]


 <link rel='nofollow' href="_content/Syncfusion.Blazor/styles/bootstrap5.css" rel="stylesheet" />

 <script src="_content/Syncfusion.Blazor/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>



The template's configuration ensures proper referencing of styles and scripts based on whether you're using individual or common NuGet packages.


If you have any further questions or require assistance, please feel free to reach out.



Regards,
Kokila Poovendran.


Attachment: SyncfusionBlazorApp1_e5d866a5.zip


MA Mario September 5, 2024 06:03 PM UTC

Im using the individual nuget, migrate to net8

and have in the host: 

<link rel='nofollow' href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" rel="stylesheet" rel='nofollow' />

<script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>


the file 


and i receive the following error when calls AlertAsync :

Microsoft.JSInterop.JSException

  HResult=0x80131500

  Message=Cannot read properties of undefined (reading 'updateContext')

TypeError: Cannot read properties of undefined (reading 'updateContext')

    at Object.updateAnimation (http://127.0.0.1:30802/_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js:34:221003)

    at http://127.0.0.1:30802/_framework/blazor.server.js:1:3047

    at new Promise (<anonymous>)

    at y.beginInvokeJSFromDotNet (http://127.0.0.1:30802/_framework/blazor.server.js:1:3004)

    at Xt._invokeClientMethod (http://127.0.0.1:30802/_framework/blazor.server.js:1:60890)

    at Xt._processIncomingData (http://127.0.0.1:30802/_framework/blazor.server.js:1:58279)

    at Xt.connection.onreceive (http://127.0.0.1:30802/_framework/blazor.server.js:1:51920)

    at s.onmessage (http://127.0.0.1:30802/_framework/blazor.server.js:1:80026)

  Source=System.Private.CoreLib

  StackTrace:

   at System.Threading.Tasks.ValueTask`1.get_Result() in /_/src/libraries/System.Private.CoreLib/src/System/Threading/Tasks/ValueTask.cs:line 812

   at Microsoft.JSInterop.JSRuntime.<InvokeAsync>d__16`1.MoveNext() in /_/src/JSInterop/Microsoft.JSInterop/src/JSRuntime.cs:line 91

   at System.Threading.Tasks.ValueTask`1.get_Result() in /_/src/libraries/System.Private.CoreLib/src/System/Threading/Tasks/ValueTask.cs:line 812

   at Microsoft.JSInterop.JSRuntimeExtensions.<InvokeVoidAsync>d__0.MoveNext() in /_/src/JSInterop/Microsoft.JSInterop/src/JSRuntimeExtensions.cs:line 26

   at Syncfusion.Blazor.Internal.SfBaseUtils.<InvokeMethod>d__18.MoveNext()




KP Kokila Poovendran Syncfusion Team September 10, 2024 08:43 AM UTC

Hi Mario,

Based on the shared details It looks like you’re encountering an issue with the DialogService in the newer version of Syncfusion Blazor (26.2.13) when calling AlertAsync. The error message indicates that there is a problem with the updateContext function in the JavaScript code.


Here are a few steps you can take to troubleshoot and potentially resolve this issue:

 

  • Update Syncfusion Packages: Ensure that all Syncfusion packages are updated to the latest version, as mismatched versions can sometimes cause issues.

 

 

  • Clear Browser Cache: Old cached scripts may also cause problems. Try clearing your browser cache or running your application in an incognito window to see if the issue persists.

 

If you still encounter the problem after following these suggestions, please provide the following details to help us understand your situation better and offer a more specific solution:

  • A code snippet that reproduces the issue or a modified sample reflecting your specific scenario. This will help us understand the component's integration in your project.
  • Detailed steps to replicate the issue.
  • A video illustration demonstrating the problem.

Attachment: SyncfusionDialog_2a20fc5e.zip

Loader.
Up arrow icon