This is a migrated thread and some comments may be shown as answers.

Set Selected Item on Load

2 Answers 308 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Joel asked on 14 May 2020, 08:42 PM

I have a grid that lists people. When it loads, I need to select a row matching the key I submit and then ensure the row is visible in the window. How do I do this? My attempt (based on what I know of the TreeList):

@(Html.Kendo().Grid<Person>()

.Name("grid")

.Columns(columns =>

{

columns.Command(command => command

.Custom("Select")

.Click("goDetail"))

.Width(Glossary.Portal.ButtonWidth);

columns.Bound(p => p.FirstName)

.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")

.ShowOperators(false)

.SuggestionOperator(FilterType.Contains)));

columns.Bound(p => p.LastName)

.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")

.ShowOperators(false)

.SuggestionOperator(FilterType.Contains)));

})

.Pageable()

.Selectable(s => s.Mode(GridSelectionMode.Single))

.Sortable()

.Scrollable()

.Filterable(ftb => ftb.Mode(GridFilterMode.Row))

.HtmlAttributes(new { style = "height:550px;" })

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Read(read => read.Action("IndexJson", "Patients").Data("getData"))

).Events(e => e.DataBound("onGridDataBound")))

Script:

function onGridDataBound(e) {

// Handle the dataBound event.

var grid = e.sender;

alert(grid == null);

var personId = $("#personId").val();

alert(personId);

if (grid != null)

{

var dataItem = grid.dataSource.get(personId);

alert(dataItem == null);

if (dataItem != null)

{

var row = $("tr[data-uid='" + dataItem.uid + "']");

alert(row == null);

if (row != null)

{

grid.select(row);

row[0].scrollIntoView();

}

2 Answers, 1 is accepted

Accepted