i exposed a collection and binded it to itemsource of autocompletebox which works but selecting or changing the text on the autocompletebox doesn't update the model like a textbox or a label!
viewmodel:
public ObservableCollection<String> SymptomsDb { get; private set; }
private String symptom;
public String Symptom
{
get { return symptom; }
set
{
symptom = value;
RaisePropertyChanged(() => this.Symptom);
}
}
public AnalysisViewModel()
{
List<String> s = new List<String>();
s.Add("test");
SymptomsDb = new ObservableCollection<String>(s);
}
view:
<controls:AutoCompleteBox
ItemsSource="{Binding SymptomsDb}"
SelectedItem="{Binding Symptom}"
Text="{Binding Symptom}"
IsTextCompletionEnabled="True"
FilterMode="Contains"/>
To get a change from the user interface back to the viewmodel, you will always need to bind the property TwoWay (except some properties like TextBox.TextProperty that are TwoWay by default):
<controls:AutoCompleteBox
ItemsSource="{Binding SymptomsDb}"
SelectedItem="{Binding Symptom, Mode=TwoWay}"
Text="{Binding Symptom}"
IsTextCompletionEnabled="True"
FilterMode="Contains"/>
Related
In my Xamarin project I have a ListView, which gets populated by an ObservableCollection, which holds "Item" objects with some properties. If I add items to the collection the UI gets updated, but if I change only a property, it won't it does nothing. Even after an UI update through adding an item does nothing, although the property gets correctly changed. How can I make the UI refresh if a property gets changed?
BindableBase is a class from PRISM that implements INotifyPropertyChanged and DelegateCommand implements ICommand, btw.
Here's my XAML:
<ListView ItemsSource="{Binding ListItems}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell x:Name="viewCell">
<ContentView Padding="0,0,0,5"
HeightRequest="50">
<ContentView.GestureRecognizers>
<TapGestureRecognizer BindingContext="{Binding Source={x:Reference listView}, Path=BindingContext}"
Command="{Binding ItemTappedCommand}"
CommandParameter="{Binding Source={x:Reference viewCell}, Path=BindingContext}" />
</ContentView.GestureRecognizers>
<Frame OutlineColor="{Binding Color}" Padding="8">
<StackLayout Orientation="Horizontal" >
<Image x:Name="checkedImage"
HeightRequest="30"
WidthRequest="30"
BackgroundColor="{Binding Color}"
/>
<Label Text="{Binding Text}"
TextColor="{Binding Color}"
Margin="20,0,0,0"
VerticalTextAlignment="Center"
HorizontalOptions="FillAndExpand"/>
<Image Source="{Binding Image}" />
</StackLayout>
</Frame>
</ContentView>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Here's my ViewModel:
public class DetailPageViewModel : BindableBase
{
public DetailPageViewModel()
{
_listItems.Add(new ViewModels.Item("#123456", "Test1", "XamarinForms.Assets.Yellow.png"));
_listItems.Add(new ViewModels.Item("#654321", "Test3", "XamarinForms.Assets.close.png"));
}
private ObservableCollection<Item> _listItems = new ObservableCollection<Item>();
public ObservableCollection<Item> ListItems
{
get { return _listItems; }
set { SetProperty(ref _listItems, value); }
}
public DelegateCommand<Item> ItemTappedCommand => new DelegateCommand<Item>(ItemTapped);
private void ItemTapped(Item listItem)
{
// Adding an item refreshes the UI.
_listItems.Add(new ViewModels.Item("#654321", "Test3", "XamarinForms.Assets.close.png"));
// But changing the color of an item does nothing. Not even after an UI refresh.
_listItems.ElementAt(_listItems.IndexOf(listItem)).Color="#987654";
}
}
And my Item class:
public class Item
{
public string Color { set; get; }
public ImageSource Check { set; get; }
public string Text { private set; get; }
public ImageSource Image { private set; get; }
public Item(string color, string text, string imageSource)
{
Check = ImageSource.FromResource("XamarinForms.Assets.checkmark-outlined-verification-sign.png");
Color = color;
Text = text;
Image = ImageSource.FromResource(imageSource);
}
}
This is because also your item class needs to implement INotifyPropertyChanged. In your case as you are using Prism you just need to make your item class extend BindableBase (Prism base class which already implements INotifyPropertyChanged for you).
Link: https://github.com/PrismLibrary/Prism/blob/a60d38013c02b60807e9287db9ba7f7506af0e84/Source/Prism/Mvvm/BindableBase.cs
That should make it work.
Also I see in you are doing this:
public ObservableCollection<Item> ListItems
{
get { return _listItems; }
set { SetProperty(ref _listItems, value); }
}
With ObservableCollections you don't need to raise the event manually as they already do it internally. They can be defined as regular properties.
public ObservableCollection<Item> ListItems {get; set;}
I'm trying to figure out how to display a category for a selected item in a ComboBox which is itself within a GridView.ItemsTemplate. Nothing that I have tried so far has worked. I've tried using SelectedValue and SelectedValuePath.
I can display the Item's Category in a textbox from within the GridView.ItemsTemplate, but not the collection in a ComboBox.
// FiledNotesPageViewModel ViewModel
public class FiledNotesPageViewModel : ViewModelBase
{
public ObservableCollection<MemoryItem> NoteItems { get; set; } = new ObservableCollection<MemoryItem>();
}
// Public Properties
public int FiledNotesId
{
get
{
return _filedNotesId;
}
set
{
_filedNotesId = value;
OnPropertyChanged("FiledNotesId");
}
}
public string Name
{
get
{
return _name;
}
set
{
_name = value;
OnPropertyChanged("Name");
}
}
public string Note
{
get
{
return _note;
}
set
{
_note = value;
OnPropertyChanged("Note");
}
}
public string Category
{
get
{
return _category;
}
set
{
_category = value;
OnPropertyChanged("Category");
}
}
// MemoryItem Model
public int FiledNotesId { get; set; }
public string Note { get; set; }
public string Name { get; set; }
public string Category { get; set; }
FiledNotesPage View
<GridView x:Name="FiledNotesGrid"
RelativePanel.Below="FilterNoteGrid"
ItemsSource="{x:Bind ViewModel.NoteItems}">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid Orientation="Horizontal"
Margin="5"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.ItemTemplate>
<DataTemplate x:DataType="data:MemoryItem">
<StackPanel Orientation="Vertical"
BorderBrush="{ThemeResource AppBarBorderThemeBrush}"
BorderThickness="2,2,2,4"
Margin="20"
Background="#FFF7F713" >
<TextBox x:Name="NoteNameTextBox"
Text="{x:Bind Name, Mode=TwoWay}"/>
<TextBox x:Name="NoteTextBox"
TextWrapping="Wrap"
AcceptsReturn="True"
Text="{x:Bind Note, Mode=TwoWay}"/>
<StackPanel Orientation="Horizontal">
<TextBlock Margin="5,0">Category:</TextBlock>
<ComboBox x:Name="NoteCategoryComboBox"
SelectedItem="{Binding FiledNotesId, Mode=TwoWay}"
MinWidth="125">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Category}" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
</StackPanel>
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
Your combobox doesn't have an ItemsSource
You need to do something like this...
In your CS File create an ObservableCollection property to bind to.
public ObservableCollection<int> FieldNoteIds {get; set;}
In your view, bind to your collection
<ComboBox ItemsSource="{Binding FieldNoteIds}">
Right now you're providing a template for how to display each item that is populated into the combobox but you're not giving it anything to populate.
MSDN Tutorial on ComboBoxes and Binding
https://code.msdn.microsoft.com/windowsdesktop/Best-ComboBox-Tutorial-5cc27f82#content
I have an Xceed datagrid in a WPF MVVM application which is set up to hold master-detail records. When a child row is selected, I want the ViewModel to detect the selected child. I would like to do this preferably with zero code-behind. I have written code which executes an action on the selected item when a contextmenu is clicked. This works correctly when a parent is selected, but always returns null when a child is selected.
I have put together a very simplified version of what I am trying to acheive:
My XAML is:
<Window x:Class="MasterDetailSelection.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:xcdg="clr-namespace:Xceed.Wpf.DataGrid;assembly=Xceed.Wpf.DataGrid.v4.2"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid.Resources>
<xcdg:DataGridCollectionViewSource x:Key="cvs_parents" Source="{Binding Path=Parents}">
<xcdg:DataGridCollectionViewSource.DetailDescriptions>
<xcdg:PropertyDetailDescription RelationName="Children"
AutoCreateDetailDescriptions="False">
</xcdg:PropertyDetailDescription>
</xcdg:DataGridCollectionViewSource.DetailDescriptions>
</xcdg:DataGridCollectionViewSource>
</Grid.Resources>
<xcdg:DataGridControl x:Name="ParentGrid"
NavigationBehavior="RowOnly"
ItemsSource="{Binding Source={StaticResource cvs_parents}}"
SelectedItem="{Binding SelectedItem}"
AutoCreateDetailConfigurations="True"
ReadOnly="True">
<xcdg:DataGridControl.ContextMenu>
<ContextMenu DataContext="{Binding PlacementTarget, RelativeSource={RelativeSource Self}}">
<MenuItem Header="Execute Command"
CommandParameter="{Binding DataContext.SelectedItem}"
Command="{Binding DataContext.SampleCommand}" />
</ContextMenu>
</xcdg:DataGridControl.ContextMenu>
</xcdg:DataGridControl>
</Grid>
</Window>
The View Model is:
namespace MasterDetailSelection
{
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.ComponentModel;
using Microsoft.Practices.Composite.Presentation.Commands;
public class ViewModel : INotifyPropertyChanged
{
private ObservableCollection<Parent> _parents;
public event PropertyChangedEventHandler PropertyChanged;
private DelegateCommand<Object> _sampleCommand;
private object _selectedItem;
public ObservableCollection<Parent> Parents
{
get { return _parents; }
set
{
_parents = value;
OnPropertyChanged("Parents");
}
}
public DelegateCommand<Object> SampleCommand
{
get
{
if (_sampleCommand == null)
{
_sampleCommand = new DelegateCommand<object>(ExecuteSampleCommand, CanExecuteSampleCommand);
OnPropertyChanged("SampleCommand");
}
return _sampleCommand;
}
}
public bool CanExecuteSampleCommand(Object commandParameter)
{
return true;
}
public void ExecuteSampleCommand(Object commandParameter)
{
Console.WriteLine("ExecuteSampleCommand");
}
public object SelectedItem
{
get { return _selectedItem; }
set
{
if (_selectedItem != value)
{
_selectedItem = value;
OnPropertyChanged("SelectedItem");
}
}
}
public void LoadParents()
{
var parents = new ObservableCollection<Parent>()
{
new Parent()
{
Id=1,
Description = "Parent1",
Children = new List<Child>(){new Child() {Id = 1, Description = "Child1"} }
}
};
Parents = parents;
}
private void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
}
}
There are 2 simple entities:
public class Parent
{
public int Id { get; set;}
public string Description { get; set;}
public IEnumerable<Child> Children { get; set;}
}
public class Child
{
public int Id { get; set; }
public string Description { get; set; }
}
The OnStartup override in App.xaml.cs contains the following:
var viewModel = new ViewModel();
var window = new MainWindow();
window.DataContext = viewModel;
viewModel.LoadParents();
window.Show();
Whenever i select the parent row, the SelectedItem setter is called with a populated object. When I selected a child row, the same setter is called, but with a null value.
Is there any way I can get a reference to the selected item when the context menu is clicked on a child row - and do this without code-behind. If not, is it possible with code-behind?
Perhaps you should set a context menu directly on the cells or row like below. Then you can send the appropriate model to the command. In the example below I use a static locator class that has my VM to bind the actual command too.
<Style TargetType="{x:Type xcdg:DataCell}">
<Setter Property="ContextMenu" Value="{StaticResource CellContextMenu}">
<Setter.Value>
<ContextMenu>
<MenuItem Header="Execute Command"
CommandParameter="{Binding}"
Command="{Binding Source={StaticResource Locator} Path=ViewModel.SampleCommand}" />
</ContextMenu>
</Setter.Value>
</Setter>
</Style>
I have a xaml names Customer.xaml like this:
<Grid x:Name="customview" >
<StackPanel x:Name="CustomPanel" >
<TextBox x:Name="CustomText" />
</StackPanel>
</Grid
Using MVVM I have created ICustomerviewmodel and Customerviewmodel like this:
public interface ICustomerviewmodel
{
ICommand SaveClientCommand { get; }
}
public class Customerviewmodel : ICustomerviewmodel , INotifyPropertyChanged
{
......
private void ExecuteSaveClient()
{
//
}
My question is how I could get the value of
inside the function ExecuteSaveClient() to save this?
You should declare a string property in your view model say:
public string CustomText { get; set; }
Assign datacontext of customview to be your viewmodel int the constructor, hope this grid is in a UserControl or Window:
this.customview.DataContext = new CustomerViewModel();
Bind to that property:
<TextBox x:Name="CustomText" Text="{Binding CustomText}"/>
Implement INotifyPropertyChanged, if TwoWay binding and notification are required.
Read more into silverlight databinding here.
Use a binding expression:
<TextBox x:Name="CustomText" Text="{Binding TestProperty}" />
Where TestProperty is a public property on your view model which is the current DataContext.
If you wish to update the value in your view model, and have this reflected in the view, then the setter of the TestProperty property should invoke the PropertyChanged event on the INotifyPropertyChanged interface implemented by your view model.
my context: Entity Framework 4.0 + WCF Ria Data Service + Silverlight 4.
Suppose I have entity People from EF, then I created PeopleVM like:
public class PeopleViewModel : ViewModelBase
{
public PeopleViewModel(){
//....
this._hasChanges = MyDomainContext.HasChanges;
}
private People _People;
public People People
{
get { return _People; }
set
{
if (value != this._People)
{
value = this._People;
this.RaisePropertyChanged("People");
}
}
}
private bool _hasChanges;
public bool HasChanges
{
get { return this._hasChanges; }
set
{
if (this._hasChanges != value)
{
this._hasChanges = value;
this.RaisePropertyChanged("HasChanges");
}
}
}
//........
private RelayCommand _saveCommand = null;
public RelayCommand SaveCommand
{
//.....
}
private RelayCommand _cancelCommand = null;
public RelayCommand CancelCommand
{
//.....
}
}
in UI xaml, I set binding as:
<TextBox Text="{Binding People.FirstName, Mode=TwoWay}" />
<TextBox Text="{Binding People.LasttName, Mode=TwoWay}" />
Then I set button in UI as:
<Button Content="Save" Command="{Binding SaveCommand}" IsEnabled="{Binding HasChanges}"/>
<Button Content="Undo" Command="{Binding CancelCommand}" IsEnabled="{Binding HasChanges}"/>
So what I want is:
initially, button should be disabled because there is no data changes.
when user type some in FirstName, LastName textbox, the button should be enabled.
But with above code, even I change firstname, lastname, the button still in disable status.
How to resolve this problem?
The problem is that your viewmodel's HasChanges property is not updated when your domain context HasChanges property is updated. I typically just expose the Domain Context as a property on the view model and bind the buttons enabled state directly to its HasChanges property.
public class PeopleViewModel : ViewModelBase
{
public PeopleViewModel(DomainContext context){
this.Context = context;
}
public DomainContext Context
{ get; private set; }
private People _People;
public People People
{
get { return _People; }
set
{
if (value != this._People)
{
value = this._People;
this.RaisePropertyChanged("People");
}
}
}
//........
private RelayCommand _saveCommand = null;
public RelayCommand SaveCommand
{
//.....
}
private RelayCommand _cancelCommand = null;
public RelayCommand CancelCommand
{
//.....
}
}
Here is the XAML for the UI to bind to the context's HasChanges:
<Button Content="Save" Command="{Binding SaveCommand}" IsEnabled="{Binding Context.HasChanges}"/>
<Button Content="Undo" Command="{Binding CancelCommand}" IsEnabled="{Binding Context.HasChanges}"/>
You must make sure that the People object is pulled out of the DomainContext in order for updates to affect the HasChanges property of that DomainContext.