Flex:programmatically selecting some row – selectedItem is null

apache-flexdatagrid

In my application, I have a datagrid that is bound to RemoteObject. The
datagrid has a corresponding form that contains the details. When
the user clicks on a row in the datagrid the form populates with the
values from the DataGrid's selectedItem.

I want to programatically select some row in my DataGrid when
the application loads.

In order to do this, I have to call validateNow() and scrollToIndex()

eg.

dg.selectedIndex = i;
dg.validateNow();
dg.scrollToIndex(i);

I put this code in the Applications creationComplete handler.

This all works great – the desired row is highlighted and selected and
the selectedIndex is i. The problem is that I can't access the data
to populate the details form. When I try to retrieve the
dg.SelectedItem property – it is null.

How does one programatically select some row in the grid on load
AND access the row data?

thanks

Best Answer

use

dg.invalidateList();
dg.callLater(setRows, [1]);

function selRows(indices:Array):void {
  dg.selectedIndices = indices;
  dg.validateNow();
  dg.scrollToRow(indices[0]);
}

Basically if you are changing DG data and selecting an item in the same flow, your seleciton will be overwritten by ListBase methods, you have to set the selections after current GUI update for which you need to use callLater methoad.

Related Solutions

R – Silverlight DataGrid Updating SelectedItem from code

I guess that you really verified that the SelectedItem has changed (you could set the Binding Mode to TwoWay temporarily to see if it works the other way round, by clicking the row you should see the highlight and SelectedItem's set-method executed). If yes, verify that you really exactly match the Property Name on PropertyChanged method invoke. Since you're not typesafe here, you might have made a spelling error. If no, check if your Databinding Attribute is set correctly. Another idea is that you might have changed the DataGrid's styles or template and now you are missing some of the Visual States. The DataGridRow can be styled using a style template. You have three selected states, called UnfocusedSelected (probably the right one), NormalSelected and MouseOverSelected.

You could try to make your own Visual State by using this template:

<Style TargetType="local:DataGridRow">
<Setter Property="IsTabStop" Value="False" />
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="local:DataGridRow">
            <localprimitives:DataGridFrozenGrid Name="Root">
                <vsm:VisualStateManager.VisualStateGroups>
                    <vsm:VisualStateGroup x:Name="CommonStates">
                        <vsm:VisualState x:Name="Normal"/>
                    <vsm:VisualState x:Name="NormalAlternatingRow">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="0"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="MouseOver">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To=".5"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="NormalSelected">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="MouseOverSelected">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="UnfocusedSelected">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                                <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="(Fill).Color" To="#FFE1E7EC"/>
                            </Storyboard>
                        </vsm:VisualState>
                    </vsm:VisualStateGroup>
                    <vsm:VisualStateGroup x:Name="ValidationStates">
                        <vsm:VisualState x:Name="Valid"/>
                        <vsm:VisualState x:Name="Invalid">
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                                </ObjectAnimationUsingKeyFrames>
                                <DoubleAnimation Storyboard.TargetName="InvalidVisualElement" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                            </Storyboard>
                        </vsm:VisualState>
                    </vsm:VisualStateGroup>
                </vsm:VisualStateManager.VisualStateGroups>
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <Grid.Resources>
                    <Storyboard x:Key="DetailsVisibleTransition">
                        <DoubleAnimation Storyboard.TargetName="DetailsPresenter" Storyboard.TargetProperty="ContentHeight" Duration="00:00:0.1" />
                    </Storyboard>
                </Grid.Resources>

                <Rectangle x:Name="BackgroundRectangle" Grid.RowSpan="2" Grid.ColumnSpan="2" Opacity="0" Fill="#FFBADDE9"/>
                <Rectangle x:Name="InvalidVisualElement" Grid.RowSpan="2" Grid.ColumnSpan="2" Opacity="0" Fill="#FFF7D8DB"/>

                <localprimitives:DataGridRowHeader Grid.RowSpan="3" Name="RowHeader" localprimitives:DataGridFrozenGrid.IsFrozen="True" />
                <localprimitives:DataGridCellsPresenter Grid.Column="1" Name="CellsPresenter" localprimitives:DataGridFrozenGrid.IsFrozen="True" />
                <localprimitives:DataGridDetailsPresenter Grid.Row="1" Grid.Column="1" Name="DetailsPresenter" />
                <Rectangle Grid.Row="2" Grid.Column="1" Name="BottomGridLine" HorizontalAlignment="Stretch" Height="1" />
            </localprimitives:DataGridFrozenGrid>
        </ControlTemplate>
    </Setter.Value>
</Setter>
</Style>

This is a copy-paste from a good MSDN Article on customizing the DataGrid Styles. You could, for example, modify the UnfocusedSelected part of the template and see if you see any change when, for example, adding a red border around it or something.

Maybe it's worth a try. I hope that you know how to apply own styles. If not, here is another MSDN Resource.

I know, these are just tips, but maybe helpful at last.

C# – How To Prevent WPF DataGrid From De-Selecting SelectedItem When Items Updated

If your grid is single-selection, my suggestion is that you use the CollectionView as the ItemsSource instead of the actual ObservableCollection. Then, make sure that Datagrid.IsSynchronizedWithCurrentItem is set to true. Finally, at the end of your "replace item logic", just move the CollectionView's CurrentItem to the corresponding new item.

Below is a sample that demonstrates this. (I'm using a ListBox here though. Hope it works fine with your Datagrid).

EDIT - NEW SAMPLE USING MVVM:

XAML

<Window x:Class="ContextTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        x:Name="window"
        Title="MainWindow" Height="350" Width="525">
    <DockPanel>
        <ListBox x:Name="lb" DockPanel.Dock="Left" Width="200" 
                 ItemsSource="{Binding ModelCollectionView}"
                 SelectionMode="Single" IsSynchronizedWithCurrentItem="True">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Path=Name}"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <TextBlock Text="{Binding ElementName=lb, Path=SelectedItem.Description}"/>

    </DockPanel>
</Window>

Code-Behind:

using System;
using System.Windows;
using System.Windows.Data;
using System.Collections.ObjectModel;
using System.Windows.Threading;

namespace ContextTest
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new ViewModel();
        }
    }

    public class ViewModel
    {
        private DataGenerator dataGenerator;
        private ObservableCollection<Model> modelCollection;
        public ListCollectionView ModelCollectionView { get; private set; }

        public ViewModel()
        {
            modelCollection = new ObservableCollection<Model>();
            ModelCollectionView = new ListCollectionView(modelCollection);

            //Create models
            for (int i = 0; i < 20; i++)
                modelCollection.Add(new Model() { Name = "Model" + i.ToString(), 
                    Description = "Description for Model" + i.ToString() });

            this.dataGenerator = new DataGenerator(this);
        }

        public void Replace(Model oldModel, Model newModel)
        {
            int curIndex = ModelCollectionView.CurrentPosition;
            int n = modelCollection.IndexOf(oldModel);
            this.modelCollection[n] = newModel;
            ModelCollectionView.MoveCurrentToPosition(curIndex);
        }
    }

    public class Model
    {
        public string Name { get; set; }
        public string Description { get; set; }
    }

    public class DataGenerator
    {
        private ViewModel vm;
        private DispatcherTimer timer;
        int ctr = 0;

        public DataGenerator(ViewModel vm)
        {
            this.vm = vm;
            timer = new DispatcherTimer(TimeSpan.FromSeconds(5), 
                DispatcherPriority.Normal, OnTimerTick, Dispatcher.CurrentDispatcher);
        }

        public void OnTimerTick(object sender, EventArgs e)
        {
            Random r = new Random();

            //Update several Model items in the ViewModel
            int times = r.Next(vm.ModelCollectionView.Count - 1);
            for (int i = 0; i < times; i++)
            {   
                Model newModel = new Model() 
                    { 
                        Name = "NewModel" + ctr.ToString(),
                        Description = "Description for NewModel" + ctr.ToString()
                    };
                ctr++;

                //Replace a random item in VM with a new one.
                int n = r.Next(times);
                vm.Replace(vm.ModelCollectionView.GetItemAt(n) as Model, newModel);
            }
        }
    }
}

OLD SAMPLE:

XAML:

<Window x:Class="ContextTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <StackPanel>
        <ListBox x:Name="lb" SelectionMode="Single" IsSynchronizedWithCurrentItem="True" SelectionMode="Multiple">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Path=Name}"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <TextBlock Text="{Binding ElementName=lb, Path=SelectedItem.Name}"/>
        <Button Click="Button_Click">Replace</Button>


    </StackPanel>
</Window>

Code-behind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Collections.ObjectModel;
using System.ComponentModel;

namespace ContextTest
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        ObservableCollection<MyClass> items;
        ListCollectionView lcv;

        public MainWindow()
        {
            InitializeComponent();

            items = new ObservableCollection<MyClass>();
            lcv = (ListCollectionView)CollectionViewSource.GetDefaultView(items);
            this.lb.ItemsSource = lcv;
            items.Add(new MyClass() { Name = "A" });
            items.Add(new MyClass() { Name = "B" });
            items.Add(new MyClass() { Name = "C" });
            items.Add(new MyClass() { Name = "D" });
            items.Add(new MyClass() { Name = "E" });

        }

        public class MyClass
        {
            public string Name { get; set; }
        }

        int ctr = 0;
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MyClass selectedItem = this.lb.SelectedItem as MyClass;
            int index = this.items.IndexOf(selectedItem);
            this.items[index] = new MyClass() { Name = "NewItem" + ctr++.ToString() };
            lcv.MoveCurrentToPosition(index);
        }

    }
}

Best Answer

Related Solutions

R – Silverlight DataGrid Updating SelectedItem from code

C# – How To Prevent WPF DataGrid From De-Selecting SelectedItem When Items Updated

Related Topic