1. Home
  2. Forum
  3. WPF
  4. Scroll down to the selected item in SfDataGrid automatically

Scroll down to the selected item in SfDataGrid automatically

In the SfDataGrid, the scroll is not moved to the selected item automatically. Please find below the sample code: 

MainWindow.xaml:

     <Grid>
             <Grid.RowDefinitions>
                 <RowDefinition Height="30"></RowDefinition>
                 <RowDefinition Height="*"></RowDefinition>
             </Grid.RowDefinitions>
             <Button Click="Button_Click" Content="New"/>
             <sf:SfDataGrid Name="dataGrid" Grid.Row="1"/>
     </Grid>

MainWindow.xaml.cs:

    public partial class MainWindow : Window
    {
        ObservableCollection<Person> Persons;
        Person mahdi = new Person { Id = 1, Name = "Mahdi" };

        public MainWindow()
        {
            InitializeComponent();

            var list = new List<Person>
            {
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                mahdi,
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
                new Person { Id = 2, Name = "John" },
            };
            Persons = new ObservableCollection<Person>(list);
            dataGrid.ItemsSource = Persons;
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            dataGrid.SelectedItem = mahdi;
        }
    }

    public class Person
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }


Regards, 
Mahdi Ehsanifar

3 Replies
DY Deivaselvan Y Syncfusion Team August 20, 2018 05:55 PM UTC

Hi Mahdi,

Thank you for contacting Syncfusion support.

Refer the below KB article to scroll and select the record programmatically and let us know if this helps you.
https://www.syncfusion.com/kb/8624/how-to-scroll-and-select-record-programmatically

Regards,
Deivaselvan 


ME Mahdi Ehsanifar August 21, 2018 12:17 PM UTC

Hello Deivaselvan,

Thank you for your reply.

I need it to be done automatically instead of programmatically since my real project is actually in MVVM approach, and there is no code behind.
Please find below the MVVM sample code:

MainWindow.xaml.cs:

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            DataContext = new PersonFormVM();
        }
    }

    public class Person
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }

    public class PersonFormVM : ViewModelBase
    {
        private CollectionViewSource _personCollection;

        public CollectionViewSource PersonCollection
        {
            get { return _personCollection; }
            set { Set(ref _personCollection, value); }
        }

        private Person _selectedPerson;

        public Person SelectedPerson
        {
            get { return _selectedPerson; }
            set { Set(ref _selectedPerson, value); }
        }

        public ICommand NewCommand { get; private set; }

        public PersonFormVM()
        {
            PersonCollection = new CollectionViewSource();
            var list = new List<Person>
            {
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
                new Person { Id = 1, Name = "John" },
            };
            PersonCollection.Source = new ObservableCollection<Person>(list);

            NewCommand = new RelayCommand(() =>
            {
                var newPerson = new Person() { Id = 2, Name = "Mahdi" };
                (PersonCollection.View.SourceCollection as ICollection<Person>).Add(newRecord);
                SelectedPerson = newPerson;
            },
            () => true);
        }
    }


MainWindow.xaml:

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="30"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <Button Command="{Binding NewCommand}" Content="New"/>
        <sf:SfDataGrid Name="dataGrid" Grid.Row="1" ItemsSource="{Binding PersonCollection.View}"
                       SelectedItem="{Binding SelectedPerson, Mode=TwoWay}"/>
</Grid>


Regards, 
Mahdi Ehsanifar

DY Deivaselvan Y Syncfusion Team August 22, 2018 05:38 PM UTC

Hi Mahdi,

Thank you for the update.

We have prepared the sample to meet your requirement for scrolling the grid to the SelectedItem in loading and dynamically at runtime. Please refer the sample for the same from the below link. You could try running this sample and let us know if this helps you.

Sample link: http://www.syncfusion.com/downloads/support/forum/139369/ze/SfGridDemo-82018995.zip

Regards,
Deivaselvan


Loader.
Up arrow icon