DevExpress Business Intelligence Dashboard Live Grid: How we can highlight the recenlty updated cell

36 Views Asked by At

I have a dev express dashboard which contains single grid. Using Init method I'm updating the grid data after couple of seconds.

Requirement is to highlight the recenlty updated cell. As below.enter image description here

PFB code render the grid. ASPX Code:

<body>
<form id="form1" runat="server">
    <div style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;">
        <dx:ASPxDashboard
            ID="ASPxDashboard1"
            runat="server" Width="100%" Height="100%"
            ClientInstanceName="db"
            WorkingMode="ViewerOnly"
            UseDashboardConfigurator="True"
            OnDashboardLoading="ASPxDashboard1_DashboardLoading" 
            ColorScheme="material.blue.light.compact">
            <ClientSideEvents
                BeforeRender="onBeforeRender"
                Init="onInit" />
        </dx:ASPxDashboard>
    </div>
</form>

xml:

<Grid ComponentName="gridDashboardItem1" Name="Sample" DataSource="dashboardSqlDataSource1" DataMember="Products">
  <DataItems>
    <Dimension DataMember="UnitPrice" DefaultId="DataItem2" />
    <Dimension DataMember="UnitsInStock" DefaultId="DataItem3" />
    <Dimension DataMember="ProductName" DefaultId="DataItem1" />
    <Dimension DataMember="ProductID" DefaultId="DataItem0" />
  </DataItems>
     <GridColumns>
    <GridDimensionColumn>
      <Dimension DefaultId="DataItem0" />
    </GridDimensionColumn>
    <GridDimensionColumn>
      <Dimension DefaultId="DataItem1" />
    </GridDimensionColumn>
    <GridDimensionColumn>
      <Dimension DefaultId="DataItem2" />
    </GridDimensionColumn>
    <GridDimensionColumn>
      <Dimension DefaultId="DataItem3" />
    </GridDimensionColumn>
  </GridColumns>
  <GridOptions />
  <ColumnFilterOptions />
</Grid>

Script:

<script type="text/javascript">
    var dashboardControl;
    var viewerApi;

    function onBeforeRender(sender) {
        dashboardControl = sender.GetDashboardControl();
        viewerApi = dashboardControl.findExtension('viewerApi');

        if (viewerApi) {
            //
        }
    }

    function onInit() {
        setInterval(refresh, 1000); // 2 min
    }

    function refresh() {
        dashboardControl.refresh(['gridDashboardItem1']);
    }

</script>

Thank you in advance.

0

There are 0 best solutions below