Kanban refresh does not work when triggered by SignalR after Editing a Card

[Kenney Phan]

Hi,

In my application, I use SignalR to update the Kanban for all other clients connected to SignalR for my app.

When I edit a card on the Kanban (card Dialog edit), I called the SignalR method to display the changes for all other clients on the app.

 Those changes are being painted in the database and Kanban Datasource, but the Kanban refresh is not showing those changes for all other clients.

I am using Syncfusion v19.2.0.56.

I have attached images for code reference.

Thank you very much,

Kenney

Attachment: Kanban_Refresh_SignalR_ee1a5e7e.zip

[Vinitha Jeyakumar]

Hi Kenney, 

 

 

Currently, we are validating your reported query. We will update you the further details in two business days on or before 6^th October 2021. 

 

We appreciate your patience until then. 

 

Regards, 

Vinitha 

[Vinitha Jeyakumar]

Hi Kenney,  

  

  

Sorry for the inconvenience caused. 

 

Still, we are validating your reported query due to its complexity in validating the issue. We will update you the further details in two business days on or before 8^th October 2021.  

  

We appreciate your patience until then.  

  

Regards,  

Vinitha  

[Vinitha Jeyakumar]

Hi Kenney,   

   

   

Sorry for the inconvenience caused.  

  

We are facing some certification issues with SignalR, while trying to validate your reported query. And it takes time to validate the issue. We will update you the further details in two business days on or before 13^th October 2021.   

   

We appreciate your patience until then.   

   

Regards,   

Vinitha   

[Vinitha Jeyakumar]

Hi Kenney,  

 

 

We are working to validate the reported issue with SignalR update. Since it is complex to validate the issue, we will update the further details about the validated details in two business days on or before 15^th October 2021. 

 

Regards, 

Vinitha 

[Vinitha Jeyakumar]

Hi Kenney, 

 

 

We have validated your query “Kanban refresh does not work when triggered by SignalR after Editing a Card” 

 

We have tried to replicate the issue you have reported. But, unfortunately we couldn’t reproduce the issue at our end when editing or drag and drop the cards in the Kanban board. 

 

We have also prepared a sample for your reference. In the following sample, While page is initialized, HubConnection is stored and maintained in OnInitializedAsync life cycle event of Blazor. Once the CRUD operation is completed, called Send() method inside the ActionComplete event of Kanban to indicate all the available clients using hub connection that changes has been made in current page. I have used On method of hub connection to trigger an event to perform some action for all the available clients. 

 

Code snippet: 

KanbanHub.cs 

 

public class KanbanHub : Hub 

    { 

        public async Task SendMessage() 

        { 

            await Clients.All.SendAsync("ReceiveMessage"); 

        } 

    } 

 

 

@code { 

    public SfKanban<Order> KanbanObj; 

    private HubConnection hubConnection; 

    public IEnumerable<Order> KanbanData { get; set; } 

    OrderContext db = new OrderContext(); 

    protected override async Task OnInitializedAsync() 

    { 

        hubConnection = new HubConnectionBuilder() 

            .WithUrl(NavigationManager.ToAbsoluteUri("/kanbanhub")) 

            .Build(); 

 

        hubConnection.On("ReceiveMessage", () => 

        { 

            CallLoadData(); // Fetch updated data from service 

            StateHasChanged(); 

        }); 

        await hubConnection.StartAsync(); 

        CallLoadData(); // For initial load of Kanban data 

    } 

    async Task Send() => 

    await hubConnection.SendAsync("SendMessage"); 

 

    public bool IsConnected => 

    hubConnection.State == HubConnectionState.Connected; 

 

    public async ValueTask DisposeAsync() 

    { 

        if (hubConnection != null) 

        { 

            await hubConnection.DisposeAsync(); 

        } 

    } 

    private void CallLoadData() 

    { 

        Task.Run(async () => 

        { 

            await LoadData(); 

        }); 

    } 

    protected async Task LoadData() 

    { 

        OrderService _craftService = new OrderService(); 

        IEnumerable DataSource = await _craftService.GetOrdersAsync();  // Fetch data from service 

        KanbanData = DataSource.Cast<Order>(); 

        await Task.Yield(); 

        await InvokeAsync(StateHasChanged); 

        await KanbanObj.RefreshAsync(); 

    } 

    private async Task OnActionComplete(ActionEventArgs<Order> args) 

    { 

        if (args.RequestType == "cardChange") // Update action 

        { 

            IEnumerable<Order> changedData = args.ChangedRecords; 

            foreach (Order updateAlert in changedData) 

            { 

                var data = db.Orders.Where(or => or.EmployeeID == (updateAlert as Order).EmployeeID).FirstOrDefault(); 

                if (data != null) 

                { 

                    data.ShipCity = (updateAlert as Order).ShipCity; 

                    data.ShipName = (updateAlert as Order).ShipName; 

                } 

                db.SaveChangesAsync(); 

            } 

            if (IsConnected) await Send(); 

        } 

    } 

} 

 

Sample: https://www.syncfusion.com/downloads/support/forum/169339/ze/blazor-kanban-crud-custom-adaptor-master247593403 

 

Follow the below steps to run the sample, 

 

1. Copy the full-path of MDF file which is located under App_Data folder. 

2. Change the connection string of MDF file in OrderContext.cs file which is placed under 'Data' folder. 

3. Now, build and run your project to view the output. 

 

Please check the sample and code snippet and if still issue persists at your end, please modify the attached sample with the issue reproducing code or share us with the runnable sample to further validate it from our end. 

 

Regards, 

Vinitha