MVVM Add/Delete Item

3 posts, 0 answers
  1. luc
    luc avatar
    24 posts
    Member since:
    Aug 2011

    Posted 31 Aug 2011 Link to this post

    Hi,

    I have a simple project with a RadTreeView and two button (add/delete) bind to ICommand from my model.
    <Window.Resources>
        <Style x:Key="itemStyle"  TargetType="telerik:RadTreeViewItem">
            <Setter Property="IsSelected" Value="{Binding Path=Select, Mode=TwoWay}" />
            <Setter Property="IsExpanded" Value="{Binding Path=Expand, Mode=TwoWay}" />
            <Setter Property="IsInEditMode" Value="{Binding Path=EditMode, Mode=TwoWay}" />
        </Style>
    </Window.Resources>
      
    <DockPanel>
        <StackPanel Orientation="Vertical" DockPanel.Dock="Bottom">
            <Button Command="{Binding AddCommand}">Add Person</Button>
            <Button Command="{Binding DeleteCommand}">Delete current</Button>
        </StackPanel>
        <telerik:RadTreeView IsEditable="True" ItemsSource="{Binding Persons}" ItemContainerStyle="{StaticResource itemStyle}" SelectedItem="{Binding Path=Current, Mode=TwoWay}">
            <telerik:RadTreeView.ItemTemplate>
                <HierarchicalDataTemplate ItemsSource="{Binding Childs}">
                    <TextBlock Text="{Binding Name}"/>
                </HierarchicalDataTemplate>
            </telerik:RadTreeView.ItemTemplate>
        </telerik:RadTreeView>
    </DockPanel>

    1 When I try to add an item my AddCommand add a item in my binding collection
    Persons.Add(new PersonViewModel(new Model.Person("New person", new string[]{})) { Select=true, EditMode=true});
    With this way the RadTreeViewItem is well editing but fill with text "RadTreeSample.ViewModel.PersonViewModel" and not "New Person". If i change EditMode=true to EditMode=false the item is well selected and well filled and i can edit correctly after. How to enable EditMode correctly ?

    2 When i delete an item it will be fun if previous item become selected. First idea was to change the selected item in the DeleteCommand BUT i think that it's not the job of the ViewModel, it's typically a job for the View. How can i implement this ? The goal is that View and ViewModel have no reference between them.
    if (Current != null)
    {
        if (Current.Parent != null) Current.Parent.Childs.Remove(Current);
        else person.Remove(Current);
        // Not the role to viewmodel to select another element
    }
  2. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 06 Sep 2011 Link to this post

    Hi Luc,

     In order to correctly use the edit mode in your case, you have to add ItemEditTemplate for example like so:

    <Window.Resources>
            <Style x:Key="itemStyle" TargetType="telerik:RadTreeViewItem">
                <Setter Property="IsSelected" Value="{Binding Path=Select, Mode=TwoWay}" />
                <Setter Property="IsExpanded" Value="{Binding Path=Expand, Mode=TwoWay}" />
                <Setter Property="IsInEditMode" Value="{Binding Path=EditMode, Mode=TwoWay}" />
            </Style>
             
            <DataTemplate x:Key="edittemplate">
                <TextBox Text="{Binding Name, Mode=TwoWay}" />
            </DataTemplate>
        </Window.Resources>
    <telerik:RadTreeView IsEditable="True"
                                x:Name="tree"
                                ItemContainerStyle="{StaticResource itemStyle}"
                                ItemsSource="{Binding Persons}"
                                SelectedItem="{Binding Path=Current, Mode=TwoWay}"
                                ItemEditTemplate="{StaticResource edittemplate}">
    On the other hand, your delete Commands need the SelectedItem from the TreeView as a parameter:
    <Button Command="{Binding DeleteCommand}" CommandParameter="{Binding ElementName=tree, Path=SelectedItem}">Delete current</Button>
    Then in the Execute method you can only work with the ViewModels ( the Parent  and the Select properties from the Person class). You can find this approach realized in the attached solution. Please let us know if you have further questions. All the best,
    Petar Mladenov
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  3. UI for WPF is Visual Studio 2017 Ready
  4. luc
    luc avatar
    24 posts
    Member since:
    Aug 2011

    Posted 08 Sep 2011 Link to this post

    It's working fine.
    Thanks
Back to Top