Questions on UI for WPF Forum

3 answers

557 views

Rad Grid View - Selected Item Binding Two Way - MVVM

Hello,
I am working on wpf application with MVVM pattern. I have telerik grid containg categories of business objects ( categoryid, category number, category name). I allow user to inline gridview editing. I have managed to update, delete categories as i expected. When user add new category, user will enter category name and will save the record to database. Gridview selected item is binding with CurrentCateogry property in viewmodel and every time selection changes it will update the currenty category in the viewmodel. After user updated the record, corresponding category will save to database and generate new categoryid and category number and passes to the UI. Above all, corresponding selected item will not updating with new values though it has updated the current category property in viewmodel.

I have attached code samples as follows.

Category.cs
==========

using

System;

using

System.Collections.Generic;

using

System.Linq;

using

System.Text;

using

System.Data;

using

System.IO;

using

System.ComponentModel;

using

System.Data.SqlClient;

namespace

RadGridSelectedItemBindingTwoWay

{

public class Category : INotifyPropertyChanged

{

private Int32 _CategoryId;

private string _CategoryNumber;

private string _CategoryName;

public Category()

{

this.CategoryId = -1;

this.CategoryNumber = String.Empty;

this.CategoryName = String.Empty;

}

public Category(Int32 CategoryId, string CategoryNumber, string CategoryName)

{

this.CategoryId = CategoryId;

this.CategoryNumber = CategoryNumber;

this.CategoryName = CategoryName;

}

public Int32 CategoryId

{

get

{

return _CategoryId;

}

set

{

_CategoryId =

value;

OnPropertyChanged(

"CategoryId");

}

public string CategoryNumber

{

get

{

return _CategoryNumber;

}

set

{

_CategoryNumber =

value;

OnPropertyChanged(

"CategoryNumber");

}

public string CategoryName

{

get

{

return _CategoryName;

}

set

{

_CategoryName =

value;

OnPropertyChanged(

"CategoryName");

}

public override string ToString()

{

string CategoryString = String.Empty;

CategoryString =

this.CategoryName;

return CategoryString;

}

public event PropertyChangedEventHandler PropertyChanged;

private void OnPropertyChanged(string propertyName)

{

if (this.PropertyChanged != null)

{

this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));

}

MainWindow.xaml
=============

<

Window x:Class="RadGridSelectedItemBindingTwoWay.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

xmlns:telerikGrid="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.GridView"

xmlns:nav="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"

xmlns:RadBind="clr-namespace:RadGridSelectedItemBindingTwoWay"

Title="RadGridView - Selected Item Binding Two Way - MVVM" Height="350" Width="525">

<Grid>

<nav:RadTabControl>

<nav:RadTabItem Header="Category">

<Grid>

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<telerik:RadDataPager Grid.Row="0" PageSize="20" Source="{Binding Items, ElementName=CategoryRadGridView}"

IsTotalItemCountFixed="False" DisplayMode="FirstLastPreviousNextNumeric, Text"

/>

<telerikGrid:RadGridView Grid.Row="1" x:Name="CategoryRadGridView" GridLinesVisibility="Horizontal"

AutoGenerateColumns="False" SelectionMode="Single"

RowIndicatorVisibility="Hidden" IsReadOnly="False"

CanUserFreezeColumns="False" ScrollViewer.HorizontalScrollBarVisibility="Hidden"

ShowGroupPanel="False"

ItemsSource="{Binding Categories}"

ActionOnLostFocus="None"

SelectedItem="{Binding Path=CurrentCategory, UpdateSourceTrigger=Explicit,Mode=TwoWay}"

KeyboardNavigation.AcceptsReturn="True"

>

<telerikGrid:RadGridView.Columns>

<telerikGrid:GridViewDataColumn DataMemberBinding="{Binding CategoryId, Mode=TwoWay}" Header="Category Id" IsReadOnly="True" IsVisible="True" />

<telerikGrid:GridViewDataColumn DataMemberBinding="{Binding CategoryNumber, Mode=TwoWay}" Header="Category Number" Width="300*" IsReadOnly="True"/>

<telerikGrid:GridViewDataColumn DataMemberBinding="{Binding CategoryName, Mode=TwoWay}" Header="Category Name" IsVisible="True" />

<telerikGrid:GridViewDataColumn >

<telerikGrid:GridViewColumn.CellTemplate>

<telerik:RadButton x:Name="Category_SaveRow" HorizontalAlignment="Stretch"

ToolTip="Update" Content="Update"

Command="{Binding Path=CategorySaveCommand}"

Loaded="Category_SaveRow_Loaded"

Click="Category_SaveRow_Click">

</telerik:RadButton>

</DataTemplate>

</telerikGrid:GridViewColumn.CellTemplate>

</telerikGrid:GridViewDataColumn>

<telerikGrid:GridViewDataColumn >

<telerikGrid:GridViewColumn.CellTemplate>

<telerik:RadButton x:Name="Category_RemoveRow" HorizontalAlignment="Stretch"

ToolTip="Delete" Content="Delete"

Command="{Binding Path=CategoryDeleteCommand}"

Loaded="Category_RemoveRow_Loaded"

Click="Category_RemoveRow_Click"

>

</telerik:RadButton>

</DataTemplate>

</telerikGrid:GridViewColumn.CellTemplate>

</telerikGrid:GridViewDataColumn>

</telerikGrid:RadGridView.Columns>

</telerikGrid:RadGridView>

<telerik:RadButton Grid.Row="2" Content="Add Category" Width="100" Margin="5,5"

Command="telerikGrid:RadGridViewCommands.BeginInsert" CommandTarget="{Binding ElementName=CategoryRadGridView}"/>

<telerik:RadButton Grid.Row="2" Content="Cancel" Width="100" Margin="5,5"

Command="telerikGrid:RadGridViewCommands.CancelRowEdit" CommandTarget="{Binding ElementName=CategoryRadGridView}"/>

</StackPanel>

</Grid>

</nav:RadTabItem>

</nav:RadTabControl>

</StackPanel>

</Grid>

</

Window>

MainWindowCS
-------------------

using

System.Windows;

using

System.Windows.Controls;

using

Telerik.Windows.Controls;

namespace

RadGridSelectedItemBindingTwoWay

{

public partial class MainWindow : Window

{

MyViewModel _MyViewModel;

public MainWindow()

{

InitializeComponent();

_MyViewModel =

new MyViewModel();

this.DataContext = _MyViewModel;

}

private void Category_SaveRow_Loaded(object sender, RoutedEventArgs e)

{

var button = (Button)sender;

button.Command = _MyViewModel.CategorySaveCommand;

}

private void Category_SaveRow_Click(object sender, RoutedEventArgs e)

{

// TODO : Explicitly set current category of the view model

_MyViewModel.CurrentCategory = (

Category)((RadButton)sender).DataContext;

this.CategoryRadGridView.CommitEdit();

}

private void Category_RemoveRow_Loaded(object sender, RoutedEventArgs e)

{

var button = (Button)sender;

button.Command = _MyViewModel.CategoryDeleteCommand;

}

private void Category_RemoveRow_Click(object sender, RoutedEventArgs e)

{

_MyViewModel.CurrentCategory = (

Category)((RadButton)sender).DataContext;

}

MyViewModel :
------------------

using

System;

using

System.Collections.ObjectModel;

using

System.ComponentModel;

using

System.Windows.Input;

using

RadGridSelectedItemBindingTwoWay.Model;

namespace

RadGridSelectedItemBindingTwoWay

{

public class MyViewModel : INotifyPropertyChanged

{

private ObservableCollection<Category> _Categories; // trigger category updates

private DelegateCommand _CategorySaveCommand; // Handle category save as delegate command

private DelegateCommand _CategoryDeleteCommand;// Handle cateogry delete as delegate command

private Category _CurrentCategory;

public MyViewModel()

{

this.Categories = GetComponentCategories();

// Initialize the delegate commands

_CategorySaveCommand =

new DelegateCommand(CategorySave);

_CategoryDeleteCommand =

new DelegateCommand(CategoryDelete);

}

public ObservableCollection<Category> Categories

{

get

{

return _Categories;

}

set

{

_Categories =

value;

this.OnPropertyChanged("Categories");

}

public ICommand CategorySaveCommand

{

get

{

if (_CategorySaveCommand == null)

{

_CategorySaveCommand =

new DelegateCommand(CategorySave);

}

return this._CategorySaveCommand;

}

public ICommand CategoryDeleteCommand

{

get

{

if (_CategoryDeleteCommand == null)

{

_CategoryDeleteCommand =

new DelegateCommand(CategoryDelete);

}

return this._CategoryDeleteCommand;

}

public Category CurrentCategory

{

get

{

return this._CurrentCategory;

}

set

{

this._CurrentCategory = value;

this.OnPropertyChanged("CurrentCategory");

}

private ObservableCollection<Category> GetComponentCategories()

{

ObservableCollection<Category> categoryOC = new ObservableCollection<Category>();

categoryOC.Add(

new Category(1, "000001", "Category1"));

categoryOC.Add(

new Category(2, "000002", "Category2"));

categoryOC.Add(

new Category(3, "000003", "Category3"));

return categoryOC;

}

public void CategorySave()

{

// Save to database and generate category id and category number and will return to the UI layer

Category SavedCategory = SaveCategoryToDatabaseAndReturnSavedCategory(this.CurrentCategory);

this.CurrentCategory = SavedCategory; // I am expecting to see save category id and catgory number as selected

// item is binding with current category property but not updated the UI with new values

}

private void CategoryDelete()

{

this.Categories.Remove(this.CurrentCategory);

}

private Category SaveCategoryToDatabaseAndReturnSavedCategory(Category toSaveCategory)

{

// Temp method to category to database and generate sequential new category id and category number

Category newCategory = new Category();

Random random = new Random();

newCategory.CategoryId = random.Next(100);

newCategory.CategoryNumber = newCategory.CategoryId.ToString();

newCategory.CategoryName = toSaveCategory.CategoryName;

return newCategory;

}

#region

INotifyPropertyChanged Members

public event PropertyChangedEventHandler PropertyChanged;

//protected virtual void OnPropertyChanged(string propertyName)

//{

// if (null != this.PropertyChanged)

// {

// this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));

// }

//}

//protected virtual void NotifyPropertyChanged(string propertyname)

//{

// if (PropertyChanged != null)

// {

// PropertyChanged(this, new PropertyChangedEventArgs(propertyname));

// }

//}

protected virtual void OnPropertyChanged(PropertyChangedEventArgs args)

{

PropertyChangedEventHandler handler = this.PropertyChanged;

if (handler != null)

{

handler(

this, args);

}

private void OnPropertyChanged(string propertyName)

{

this.OnPropertyChanged(new PropertyChangedEventArgs(propertyName));

}

#endregion

}

Command
-------------

public

class DelegateCommand : ICommand

{

private Action _executeMethod;

public DelegateCommand(Action executeMethod)

{

_executeMethod = executeMethod;

}

public bool CanExecute(object parameter)

{

return true;

}

public event EventHandler CanExecuteChanged;

public void Execute(object parameter)

{

_executeMethod.Invoke();

}

Thanking You..

GridView

answered on 03 Sep 2011

1 answer

81 views

Styling the RadWindow for Data Entry

I have spent the last few days getting the GridView "ready" for data entry (Insert, Update, Delete) and I did notice some issues, like the need to hit Escape twice while "adding a new record" (ShowInsertRow) as well some errors when I try to add a new record after doing a "cancel new record"

Then I come across the link below and that just tells me that I want to go away from having these operations (Insert, Update, Delete) in the GridView

http://www.telerik.com/community/forums/silverlight/gridview/addingnewdataitem-and-haschanges.aspx

Now, what I would like to do is open up a window an style it appropriately for Data Entry. I am sure this has been asked/covered already but I was not able to find much. Can someone please point me in the right direction?

Thanks in advance.

Window

answered on 03 Sep 2011

2 answers

174 views

GridViewComboBoxColumn perormance, makes scrolling impossible

Hi,
When i bind 3000 records in RadGrid (only one column) GridViewComboBoxColumn
i got terrible performance.

I need to do this from code behind.

to reproduce problem make WPF in Browser application, and add this page

<Page x:Class="Bug_Demo_ComboBoxColumn_Scroll.Page1"       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"        xmlns:telerikGrid="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.GridView"       mc:Ignorable="d"        d:DesignHeight="300" d:DesignWidth="300"       Title="Page1">     <Grid>         <telerik:RadGridView              Name="dgDynGrid"                        AutoGenerateColumns="False"                            EnableColumnVirtualization="True"             EnableRowVirtualization="True"                         ShowGroupPanel="False"             IsFilteringAllowed="False"             DataLoadMode="Asynchronous"               CanUserInsertRows="True"                          CanUserResizeColumns="False"             CanUserFreezeColumns="False"             RowIndicatorVisibility="Collapsed"               />          </Grid> </Page>

Then make two classes:

    public class Persons     {         public int Id { get; set; }         public string Name { get; set; }         public string PlaceId { get; set; }     }

    public class Place     {         public int PlaceId { get; set; }         public string PlaceName { get; set; }     }

in constructor of "Page1" fill test data:

List<Place> places = new List<Place>();             for (int i = 0; i < 3000; i++)             {                 Place p = new Place();                 p.PlaceId = i;                 p.PlaceName = "PlaceWithID" + i.ToString();                 places.Add(p);             }             List<Persons> persons = new List<Persons>();             for (int i = 0; i < 3000; i++)             {                 Persons p = new Persons();                 p.Id = i;                 p.PlaceId = i.ToString();                 persons.Add(p);             }

Add column:

Telerik.Windows.Controls.GridViewComboBoxColumn column = new Telerik.Windows.Controls.GridViewComboBoxColumn();             column.DataMemberBinding = new Binding("PlaceId");             column.DisplayMemberPath = "PlaceName";             column.SelectedValueMemberPath = "PlaceId";             column.ItemsSource = places;             dgDynGrid.Columns.Add(column);             dgDynGrid.ItemsSource = persons;

is it possible to turn on virtualization in GridViewComboBoxColumn ?

GridView

answered on 03 Sep 2011

1 answer

37 views

It is possible mark in timeline bar the seleted appointment(s) and the appointment dragged?

It is possible mark in timeline bar the seleted appointment(s) and the appointment dragged? The link contains a screenshot where I've drawn the red lines with the Paint program:

ScheduleView

answered on 02 Sep 2011

2 answers

59 views

Not answered how to insert update delete auto use RadGridView?

GridView windows control can insert update delete automatic and insert connection to SQL.How can i do like that in RadGridView?if can,can you make a video to easy understand?I want to insert update delete like the demo Command of RadGridView 100% with SQL server using C#.how con i do?

thank you thank you very very much!Please!

GridView

answered on 02 Sep 2011

9 answers

506 views

RadGridView validation and IDataErrorInfo

I am using the RADGrid view in a WPF application and need to add validation for a couple of properties that are bound to the grid. I have implemented IDataErroinfo on may data object class that is the source of my binding. The validation is working almost like I need it to.

when the application loads and my property values are not valid the validation works as expected. My cells with invalid data is surrounded with a red line and I get the icon displayed in front of the row with errors. When I edit the cell and correct the data the red outline of the cell goes away it I tab out the cell or hit enter. However the error icon stays unless I hit the enter key or tab through all the cells in the row.

The behavior I am trying to achieve is that when the user leaves(by using the enter key,tab out of the cell or when the cell loses focus) the cells and no other cells contain data the error icon disappears as well.

I am also using the cell validating event on the RadGrid view to validate the cell data and that seems to work except the error indicator stays there.

Thanks,
Alan Frye

GridView

answered on 02 Sep 2011

3 answers

276 views

Keep RadButton on Pressed State or Activated state.

Hello, how can I keep my button from its pressed state? For example, I clicked on the ViewByday Button, then its pressed state or activated state is still there unless i'll click another radbutton. Please help. Thanks

Buttons

answered on 02 Sep 2011

2 answers

130 views

Value Converter In GridViewDataColumn in RadTreeListView colums

Hi,
I am having an issue in binding a Value Converter in a GridViewDataColumn in RadTreeListView columns. If i add the same to DataTemplate then it works fine. Is there any way to directly use with the GridViewDataColumn .

Please find the code below.

This does not work.

<

telerik:RadTreeListView x:Name="rtlvPeopleInfo" >

<telerik:RadTreeListView.Columns>

<telerik:GridViewDataColumn x:Name="gvcPlanFinish" DataMemberBinding="{Binding PlanEndDate}" Header="Plan Finish"

Background="{Binding PlanEndDate, Converter={StaticResource PlanFinishBackColorConverterKey}}"
DataFormatString="{}{0:MM-dd-yyyy}" />

</telerik:RadTreeListView.Columns>

</telerik:RadTreeListView>

But if i am doing the same in code behind with data template that works fine

private

void SetValueConvertersInColumns()

{

GridViewDataColumn gvcPlanFinish = new GridViewDataColumn();

FrameworkElementFactory tbPlanWork = new FrameworkElementFactory(typeof(TextBlock));

Binding bndText = new Binding("PlanEndDate");

bndText.Mode =

BindingMode.TwoWay;

tbPlanWork.SetBinding(

TextBlock.TextProperty, bndText);

Binding bndPlanWorkBackGround = new Binding("PlanEndDate");

bndPlanWorkBackGround.Converter =

this.FindResource("PlanFinishBackColorConverterKey") as IValueConverter;

tbPlanWork.SetBinding(

TextBlock.BackgroundProperty, bndPlanWorkBackGround);

DataTemplate dataTemplate = new DataTemplate();

dataTemplate.VisualTree = tbPlanWork;

gvcPlanFinish.CellTemplate = dataTemplate;

gvcPlanFinish.CellTemplate.Seal();

gvcPlanFinish.DataMemberBinding =

new Binding("PlanEndDate");

rtlvTreeListView.Columns.Add(gvcPlanFinish); //Adding the new column

}

TreeListView

answered on 02 Sep 2011

1 answer

109 views

Displaying a text message

Hello I am working with the RadDatePicker and it works fine but I can't seem to figure out how tp display text in the textbox part, other than a watermark. We use it for insurance expiration dates and one of the possible fields would be "No End" instead of a date. How can I do this? Thank you again for your help.

Sean

DatePicker

answered on 02 Sep 2011

3 answers

252 views

problem with radwindow as usercontrol

Hello i try the latest internal build from Q2 2011 for WPF 4. I have some radwindows as usercontrol
defined in the main xaml file. I get compiler errors and can't get it to run.
In code i call CtlNewPerson.ShowDialog()
This sample is runnning under Q1 SP1 latest internal build correctly.
Can you please check this issue.
best regards ...

<telerik:RadWindow x:Name="WindowNewPerson" Width="800" Height="626" Header="Test ..." WindowStartupLocation="CenterScreen" telerik:StyleManager.Theme="Windows7" FontFamily="Verdana" IsRestricted="True" ResizeMode="NoResize" >

<telerik:RadWindow.Background>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="White"/>

<GradientStop Color="#FFE5EAEC" Offset="1"/>

</LinearGradientBrush>

</telerik:RadWindow.Background>

<telerik:RadWindow.Effect>