Grid Events

Smart.Grid provides numerous events to help you develop custom behavior that fits your project's needs.

The events must first be attached as a property to the Grid, then specify the custom function they should execute.

Note that event.detail contains different information depening on the event

@inject WeatherForecastService ForecastService

<Grid DataSource="@forecast" Filtering="@filtering" OnFilter="OnFilter">
  <Columns>
    <Column DataField="Date" Label="Date"> </Column>
    <Column DataField="TemperatureC" Label="Temp. (C)"> </Column>
    <Column DataField="TemperatureF" Label="Temp. (F)"> </Column>
    <Column DataField="Summary" Label="Summary"> </Column>
  </Columns>
</Grid>

@code{
  private WeatherForecast[] forecast;
    
  GridFiltering filtering = new GridFiltering(){
      Enabled = true,
      FilterRow = new GridFilteringFilterRow(){ Visible = true, AutoApplyModeDelay=50}
  };
  protected override async Task OnInitializedAsync()
  {
      base.OnInitialized();
      forecast = await ForecastService.GetForecastAsync(DateTime.Now);
  }
  private void OnFilter(Event ev)
  {
      GridFilterEventDetail filterEventDetail = ev["Detail"];
      Console.WriteLine(filterEventDetail.Data[0].dataField);
      //Outputs the dataField of the column used for filtering
  }
}

Filter, Sort, Edit-related Events

• OnBeginEdit - triggered, when the edit begins.
  Event Detail: string id, string dataField, dynamic row, dynamic column, dynamic cell
• OnBatchChange - triggered, when the Grid's header toolbar is displayed and the 'OK' button of a header dropdown is clicked.
  For example, when you open the columns customize panel, reorder columns and click the 'OK' button.
  Event Detail: string type
• OnBatchCancel -triggered, when the Grid's header toolbar is displayed and the 'Cancel' button of a header dropdown is clicked.
  Event Detail: string type
• OnEndEdit - triggered, when the edit ends.
  Event Detail: string id, string dataField, dynamic row, dynamic column, dynamic cell
• OnFilter - triggered, when a filter is added or removed.
  Event Detail: dynamic columns, dynamic data
• OnSort - triggered, when a sorting column is added or removed.
  Event Detail: dynamic columns, dynamic data

Column-related Events

• OnColumnClick - triggered, when the user clicks on the header of a column.
  Event Detail: dynamic column, string dataField, dynamic originalEvent
• OnColumnDoubleClick - triggered, when the user double clicks on the header of a column.
  Event Detail: dynamic column, string dataField, dynamic originalEvent
• OnColumnResize - triggered, when the user resized a column.
  Event Detail: dynamic column, string dataField, string oldWidth, string width
• OnColumnDragStart - triggered, when the user starts a column drag.
  Event Detail: dynamic column, string dataField, int index, dynamic originalEvent
• OnColumnDragging - triggered, when the user drags a column.
  Event Detail: dynamic column, string dataField, int index, dynamic data, dynamic originalEvent
• OnColumnDragEnd - triggered, when the user drops a column.
  Event Detail: dynamic column, string dataField, int index, int newIndex, dynamic data, dynamic originalEvent
• OnColumnReorder - triggered, when the user reorders a column.
  Event Detail: dynamic column, string dataField, int index, int newIndex, dynamic data, dynamic originalEvent

Row-related Events

• OnRowDragStart - triggered, when the user starts a row drag.
  Event Detail: dynamic row, string id, int index, dynamic originalEvent
• OnRowDragging - triggered, when the user drags a row.
  Event Detail: dynamic row, string id, int index, dynamic data, dynamic originalEvent
• OnRowDragEnd - triggered, when the user drops a row.
  Event Detail: dynamic row, string id, int index, int newIndex, dynamic data, dynamic originalEvent
• OnRowReorder - triggered, when the user reorders a row.
  Event Detail: dynamic row, string id, int index, int newIndex, dynamic data, dynamic originalEvent
• OnRowExpand - triggered, when the user expands a row of the Grid(in TreeGrid/Grouping mode).
  Event Detail: dynamic row, string id, dynamic originalEvent
• OnRowCollapse - triggered, when the user collapses a row of the Grid(in TreeGrid/Grouping mode).
  Event Detail: dynamic row, string id, dynamic originalEvent
• OnRowClick - triggered, when the user clicks on a row of the grid.
  Event Detail: dynamic row, dynamic originalEvent, string id, bool isRightClick, int pageX, int pageY
• OnRowDoubleClick - triggered, when the user double clicks on a row of the grid.
  Event Detail: dynamic row, dynamic originalEvent, string id, bool isRightClick, int pageX, int pageY
• OnRowResize - triggered, when the user resized a row.
  Event Detail: dynamic row, string id, string oldHeight, string height
• OnRowTap - triggered when the user touches and holds on the row for at least 300ms.
  Event Detail: dynamic row, dynamic originalEvent

Cell-related Events

• OnCellClick - triggered, when the user clicks on a cell of the grid.
  Event Detail: dynamic cell, dynamic originalEvent, string id, string dataField, bool isRightClick, int pageX, int pageY
• OnCellDoubleClick - triggered, when the user double clicks on a cell of the grid.
  Event Detail: dynamic cell, dynamic originalEvent, string id, string dataField, bool isRightClick, int pageX, int pageY
• OnCellClick - triggered, when the user clicks on a cell of the grid.
  Event Detail: dynamic cell, dynamic originalEvent, string id, string dataField, bool isRightClick, int pageX, int pageY
• OnCellTap - triggered when the user touches and holds on the cell for at least 300ms.
  Event Detail: dynamic cell, dynamic originalEvent

Other Events

• OnChange - triggered, when the selection is changed.
  When you select with a drag, the event is triggered when the drag starts and ends.
  Event Detail: bool started, bool finished, Event originalEvent
• OnOpenColumnDialog - triggered, when the add new column dialog is opened.
  Event Detail: string dataField
• OnCloseColumnDialog - triggered, when the add new column dialog is closed.
  Event Detail: string dataField
• OnPage - triggered, when the user changes the pages.
  Event Detail: N/A
• OnScrollBottomReached -triggered, when the user reaches the bottom of the grid.
  Event Detail: N/A
• OnScrollTopReached -triggered, when the user reaches the top of the grid.
  Event Detail: N/A