Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

SyncFusion C# Blazor DataGrid issue

$
0
0

I'm trying to create a simple datagrid using SyncFusion in Blazor, meant to hold tasks, but I can't get the commands right. The Add button works fine; the Delete button works but doesn't refresh the page; the Edit command works partially, selecting an entry and clicking the button does enter the "inline editing mode", when I click Update it runs the "edit" portion of OnActionBegin(), but the task sent in the args is the original task and not the "altered" one. Plus, it doesn't even exit the "inline editing mode", only being able to exit if i click the cancel button.

Here's the code:

@page "/datagrid-features"@using BlazorUI.Models@rendermode InteractiveServer@inject ITarefaService taskService@using Syncfusion.Blazor.Grids<PageTitle>DataGrid</PageTitle><h2>DataGrid</h2><br/><div id = "ControlRegion"><SfGrid ID="Grid" DataSource="@Tasks" @ref="Grid"    AllowPaging="true" AllowFiltering="true" AllowReordering="true" AllowResizing="true"    AllowGrouping="true" AllowExcelExport="true" AllowSelection="true" AllowSorting="true"    Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update", "Search"})"    Height="315" Width="900"><GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true"        Mode="EditMode.Normal"></GridEditSettings><GridFilterSettings Type="FilterType.FilterBar"></GridFilterSettings><GridPageSettings PageSizes="true"></GridPageSettings><GridSelectionSettings Type="SelectionType.Multiple"></GridSelectionSettings><GridEvents OnToolbarClick="ToolbarClick" OnActionBegin="OnActionBegin" OnActionComplete="OnActionComplete" TValue="Tarefa"></GridEvents><GridColumns><GridColumn Type="ColumnType.CheckBox" Width="50"></GridColumn><!-- Task Name --><GridColumn Field=@nameof(Tarefa.TaskName) HeaderText="Task Name"            ValidationRules="@(new ValidationRules{ Required=true })" Width="200"></GridColumn><!-- Start Date --><GridColumn Field=@nameof(Tarefa.StartDate) HeaderText="Start Date"            EditType="EditType.DatePickerEdit" Format="yyyy-MM-dd"            TextAlign="TextAlign.Right" Width="130"            Type="ColumnType.Date"></GridColumn><!-- End Date --><GridColumn Field=@nameof(Tarefa.EndDate) HeaderText="End Date"            EditType="EditType.DatePickerEdit" Format="yyyy-MM-dd"            TextAlign="TextAlign.Right" Width="130"            Type="ColumnType.Date"></GridColumn><!-- Is Done --><GridColumn Field=@nameof(Tarefa.IsDone) HeaderText="Is Task Done"            EditType="EditType.BooleanEdit" Width="120" Type="ColumnType.Boolean"></GridColumn></GridColumns></SfGrid></div><style>    .ulstyle {    margin: 0px;    padding-left: 20px;    display: inline-block;    }    .list {    float: left;    line-height: 20px;    margin: 10px;    min-width: 200px;    }</style>@code {    public List<Tarefa>? Tasks { get; set; }    SfGrid<Tarefa>? Grid;    protected override async Task OnInitializedAsync()    {        Tasks = await taskService.GetTarefasAsync();    }    public async Task ToolbarClick(Syncfusion.Blazor.Navigations.ClickEventArgs args)    {        if (args.Item.Id == "Grid_csvexport")        {            await this.Grid?.ExportToCsvAsync();        }    }    public async Task OnActionBegin(ActionEventArgs<Tarefa> args)    {        if (args.RequestType == Syncfusion.Blazor.Grids.Action.Save)        {            if (args.Action == "Add")            {                var newTask = args.RowData as Tarefa;                if (newTask != null)                    await taskService.AdicionarTarefaAsync(newTask);            }            else if (args.Action == "Edit")            {                var updatedTask = args.RowData as Tarefa;                if (updatedTask != null)                    await taskService.AtualizarTarefaAsync(updatedTask);            }        }        else if (args.RequestType == Syncfusion.Blazor.Grids.Action.Delete)        {            var selectedRecords = this.Grid?.SelectedRecords ?? new List<Tarefa>();            foreach (var record in selectedRecords)            {                var deletedTask = record as Tarefa;                if (deletedTask != null)                    await taskService.RemoverTarefaAsync(deletedTask);            }        }    }    private async Task OnActionComplete(ActionEventArgs<Tarefa> args)    {        if (args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.Save) || args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.Delete))        {            Tasks = await taskService.GetTarefasAsync();        }    }}

I tried forcing a grid refresh in the editing part, it "works" as in it exits the inline editing but the updatedTask is still the task before changing the values.


Viewing all articles
Browse latest Browse all 4839

Trending Articles