DxGrid.MakeCellVisibleAsync(Object, String) Method

Navigates to the cell bound to the specified data item’s field.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v25.2.dll

Declaration

public Task MakeCellVisibleAsync(
    object dataItem,
    string fieldName
)

Parameters

Name	Type	Description
dataItem	Object	A data item.
fieldName	String	A data source field name.

Returns

Type	Description
Task	The task that is completed when the cell becomes visible.

Remarks

The Grid uniquely identifies each data cell by the bound data item and associated field. Pass a data item and field name to the MakeDataItemVisibleAsync method to make the corresponding cell visible on screen. Once called, the method performs the following actions:

1. If the item is in a collapsed group, expands the group.
2. If the row is on another page, navigates to that page and updates the PageIndex property.
3. Scrolls the Grid horizontally/vertically until the cell appears.

The MakeDataItemVisibleAsync method does nothing in the following cases:

• No row corresponds to the passed data item or the corresponding row is filtered out.
• No visible column corresponds to the passed field name.
• Grid data is grouped by the corresponding column and ShowGroupedColumns is false (default).

The following code snippet adds a button that navigates to the selected cell’s Forecast value:

Razor

@inject WeatherForecastService ForecastService

<DxGrid Data="@Data" 
        @ref="MyGrid" 
        SelectionMode="GridSelectionMode.Single" 
        @bind-SelectedDataItem="@SelectedDataItem"
        KeyFieldName="Date">
    <Columns>
        <DxGridSelectionColumn />
        <DxGridDataColumn FieldName="Date" DisplayFormat="D" />
        <DxGridDataColumn FieldName="TemperatureC" Caption="@("Temp. (\x2103)")" Width="120px" />
        <DxGridDataColumn FieldName="TemperatureF" Caption="@("Temp. (\x2109)")" Width="120px" />
        <DxGridDataColumn FieldName="Forecast" />
        <DxGridDataColumn FieldName="CloudCover" />
    </Columns>
    <ToolbarTemplate>
        <DxToolbar>
            <DxToolbarItem Text="Go to Selected Forecast" 
                           Click="@(() => MyGrid.MakeCellVisibleAsync(SelectedDataItem, "Forecast"))" />
        </DxToolbar>
    </ToolbarTemplate>
</DxGrid>

@code {
    IGrid MyGrid;
    IEnumerable<WeatherForecast> Data { get; set; }
    object SelectedDataItem { get; set; }

    protected override void OnInitialized() {
        Data = ForecastService.GetForecast();
        SelectedDataItem = Data.Last();
    }
}

WeatherForecast

using System;

public class WeatherForecast {
    public DateTime Date { get; set; }
    public int TemperatureC { get; set; }
    public double TemperatureF => Math.Round((TemperatureC * 1.8 + 32), 2);
    public string Forecast { get; set; }
    public string CloudCover { get; set; }
    public bool Precipitation { get; set; }
}

WeatherForecastService

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Threading;
    using System.Threading.Tasks;

    public class WeatherForecastService {
        private List<WeatherForecast> Forecast { get; set; }

        private static string[] CloudCover = new[] {
            "Sunny", "Partly cloudy", "Cloudy", "Storm"
        };

        Tuple<int, string>[] ConditionsForForecast = new Tuple<int, string>[] {
            Tuple.Create( 22 , "Hot"),
            Tuple.Create( 13 , "Warm"),
            Tuple.Create( 0 , "Cold"),
            Tuple.Create( -10 , "Freezing")
        };

        public WeatherForecastService() {
            Forecast = CreateForecast();
        }

        private List<WeatherForecast> CreateForecast() {
            var rng = new Random();
            DateTime startDate = DateTime.Now;
            return Enumerable.Range(1, 150).Select(index => {
                var temperatureC = rng.Next(-10, 30);
                return new WeatherForecast {
                    Date = startDate.AddDays(index),               
                    TemperatureC = temperatureC,
                    CloudCover = CloudCover[rng.Next(0, 4)],
                    Precipitation = Convert.ToBoolean(rng.Next(0, 2)),
                    Forecast = ConditionsForForecast.First(c => c.Item1 <= temperatureC).Item2
                };
            }).ToList();
        }

        public IEnumerable<WeatherForecast> GetForecast() {
            return Forecast.ToArray();
        }
        // ...
}

Program.cs

// ...
builder.Services.AddSingleton<WeatherForecastService>();

Implements

MakeCellVisibleAsync(Object, String)