1. Home
  2. Forum
  3. Blazor
  4. Grid data cannot be edited.

Grid data cannot be edited.

I have copied the source code for  "Example of Inline Editing in Blazor DataGrid Component" into a Blazor Web app i am building using VS 2022 preview.  When I run the app, it shows a data table that is exactly the same as the Demo.  However, I cannot edit the data.  The Syncfusion demo page says that I can edit a record by a double click on a row or when I click on the toolbar edit button.  However, those actions do not allow editing as far as I can tell.  

I am not including code here, because it is copied directly from the example.  I copied InlineEditing.razor and Orders.cs. 

What am I doing wrong?




1 Reply
PS Prathap Senthil Syncfusion Team October 14, 2024 10:23 AM UTC

Hi Dennis Imbro,

Based on the issue you've reported, it appears you're encountering a problem with your .NET 8 project. To resolve this, please try the following suggestions: add the renderMode="InteractiveServer" option and ensure the necessary script is included in your App.razor file.


  1. CDN
 
Scripts- https://blazor.syncfusion.com/documentation/common/adding-script-references#cdn-reference
Styles - https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference

 
  1. Static Web Assets

Scripts - https://blazor.syncfusion.com/documentation/common/adding-script-references#static-web-assets

 

Styles - https://www.nuget.org/packages/Syncfusion.Blazor.Themes/


If you are using Syncfusion.Blazor single NuGet. If this is the case, we recommend referring to the attached code snippet and our documentation for further assistance.

Note:If you are  Syncfusion.Blazor single NuGet you don’t need to install the Syncfusion.Blazor.Themes  Nuegt.

App.Razor
<!DOCTYPE html>

<html lang="en">

 

<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="bootstrap/bootstrap.min.css" />

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

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

    <link rel="icon" type="image/png" rel='nofollow' href="favicon.png" />

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

    <HeadOutlet />

</head>

 

<body>

    <Routes />

 

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

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

 

    <!--Use below script reference if you are using Syncfusion.Blazor Single NuGet-->

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

 

 

</body>

 

</html>

 


Documentation: Getting Started with Blazor DataGrid Component | Syncfusion


@page "/GridComponent.razor "

@rendermode InteractiveServer

 

 


For more detailed insights, please visit the following blog and documentation.

Blog: https://www.syncfusion.com/blogs/post/blazor-ui-support-dotnet-8.aspx
UG: https://blazor.syncfusion.com/documentation/datagrid/getting-started-with-web-app

Documentation: https://learn.microsoft.com/en-us/aspnet/core/blazor /components/render-modes?view=aspnetcore-8.0|



Regards,
Prathap Senthil


Attachment: BlazorWebapp_a3ea94de.zip

Loader.
Up arrow icon