How to stop dashboardLayoutPanels from updating content after events

[Vincent McCarthy]

Hello,

Is there anyway to stop the DashboardLayoutPanel from updating after every event?

For example below I don't want to show the latest date but the initial date when the control was loaded. (this is a trivial example for illustration purposes)
After every drag is finished below the content updates - is there any way to force the content to not update and retain the original information after first render? In short I dont want to have to re-create the contents of the panels each time.

Regards
Vincent

@page "/layout"

@using Syncfusion.Blazor.Layouts

                   CellAspectRatio="2" 

                   Columns="5" 

                   DraggableHandle=".e-panel-header">

   

   

       

           

Panel 1

           

               

Hello I am panel 1

               

The date this was created was  @DateTime.UtcNow.ToString() (I dont want this to update on every event)

           

       

       

           

Panel 2

           

               

Hello I am panel 2

               

The date is  @DateTime.UtcNow.ToString()

           

       

       

           

Panel 3

           

               

Hello I am panel 3

               

The datye is  @DateTime.UtcNow.ToString()

           

       

   

@code{

// attempts to use ShouldRender but only works at a page level so no use here

    private bool _needReload;

    protected override bool ShouldRender()

    {

        if (_needReload)

        {

            return true;

        }

        else

        {

            _needReload = true;

            return false;

        }

    }

    protected override void OnAfterRender(bool first)

    {

        _needReload = false;

    }

    private void DashboardLayoutChanged(Syncfusion.Blazor.Layouts.ChangeEventArgs args)

    {

        _needReload = false;

    }

}

[Sowmiya Padmanaban]

Hi Vincent McCarthy,  

 

Greetings from Syncfusion support. 

 

We have checked your reported problem with DashboardLayout component. When you drag the DashboardLayout panel, corresponding panel position will be changed. When updating the panel position cell position of panel will change, so data-row, data-col properties of Dashboard Layout will change. When any property of DashboardLayout change then component will be re-rendered by default (This is the  default behaviour of Blazor platform for DashboardLayout component).  

 

To resolve this issue, you need to store the date in a variable and use that variable in content template. So, content template is updated based on the variable value on re-renders. 

 

Refer the below code snippet. 

 

@using Syncfusion.Blazor.Layouts 

 

<SfDashboardLayout CellSpacing="@(new double[]{10 ,10 })"  Columns="5" AllowResizing="true" > 

    <DashboardLayoutPanels> 

        <DashboardLayoutPanel> 

            <ContentTemplate><div>@current_timediv>ContentTemplate> 

        DashboardLayoutPanel> 

        <DashboardLayoutPanel SizeX=2 SizeY=2 Col=1> 

            <ContentTemplate><div>1div>ContentTemplate> 

        DashboardLayoutPanel> 

        <DashboardLayoutPanel SizeY=2 Col=3> 

            <ContentTemplate><div>2div>ContentTemplate> 

        DashboardLayoutPanel> 

        <DashboardLayoutPanel Row=1> 

            <ContentTemplate><div>3div>ContentTemplate> 

        DashboardLayoutPanel> 

    DashboardLayoutPanels> 

SfDashboardLayout> 

@code { 

    public string current_time = DateTime.UtcNow.ToString(); 

} 

 

Please, refer the below sample 

 

https://www.syncfusion.com/downloads/support/forum/158050/ze/Dashboard491710506.zip 

 

Please, refer the following links to know more about SF Blazor DashboardLayout component  

  

UG Documentation	https://blazor.syncfusion.com/documentation/dashboard-layout/getting-started/
Demo link	https://blazor.syncfusion.com/demos/dashboard-layout/default
API reference	https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Layouts.SfDashboardLayout.html

   

Please let us know, if you need any further assistance.  

  

Regards,   

Sowmiya.P  

[Vincent McCarthy]

Hello Sowmiya, 

Thanks for the response.
The example I provided was trivial and the actual components I use in my project in each layout panel contain lots of different data/graphs etc so that's why I was keen to avoid a reload.
But as a complete re-render is default behaviour for layoutPanel then I'll have to accept the reloading of the components in the LayoutPanel content.

Regards
Vincent

[Sowmiya Padmanaban]

Hi Vincent McCarthy,  

 

Thanks for the update. 

 

Please let us know, if you need any further queries with DashboardLayout component. We will happy to assist you. 

 

Regards,  

Sowmiya.P