I have a Silverlight page that is using MVVM. on the page I have several controls that I need to validate. for dropdowns and text boxes it is not so hard. i.e.
<TextBox Grid.Row="4" Grid.Column="1" Text="{Binding EmailAddress, Mode=TwoWay, ValidatesOnNotifyDataErrors=True}">
<i:Interaction.Behaviors>
<behaviors:UpdateOnTextChangedBehavior />
</i:Interaction.Behaviors>
</TextBox>
and I get the nice little red box with my message that I bound in the model.
but I also have a place were I have two check boxes in a stackpanel. I need to make sure one of the boxes is check. and I would like the error message to show up ether next to the stackpanal or the labeltextbox that is the 1st item in the stackpanal.
<StackPanel Grid.Row="6"
Grid.ColumnSpan="2">
<ac:LabelTextBox Content="Business Group(s):" />
<CheckBox HorizontalAlignment="Left"
VerticalAlignment="Center"
IsThreeState="False"
Content="XXX"
IsChecked="{Binding User.HasXXXUserRole, Mode=TwoWay, ValidatesOnExceptions=True}"
Margin="3"
FlowDirection="LeftToRight">
</CheckBox>
<CheckBox HorizontalAlignment="Left"
VerticalAlignment="Center"
IsThreeState="False"
Content="YYY"
IsChecked="{Binding User.HasYYYUserRole, Mode=TwoWay, ValidatesOnExceptions=True}"
Margin="3"
FlowDirection="LeftToRight" />
</StackPanel>
Thanks
Danny
Related
How do I update a nested ListBox in my viewmodel (Mvvm Light) without page navigation after the initial view has been displayed. Currently I am doing a re-entrant page navigation using a changing querystring - there must be a better way?
RaisePropertyChanged is having no effect although I can see the data is populated with the correct data when the callback from the soap request triggered via OpenCallingPoints has fired.
The grid I am trying to populate with soap data is CallingPointsGrid
Short version of the code...
<ListBox x:Name="ResultsListBox" Margin="0" VerticalAlignment="Top" ItemsSource="{Binding JourneyLegs, Mode=TwoWay}" Background="{StaticResource BackgroundWhiteGradientBrush}" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel x:Name="StationItem" Orientation="Vertical" VerticalAlignment="Top" background="{Binding id, Converter={StaticResource myconverter}}">
<Grid Name="CallingPointsGrid" Margin="15,10,55,10" Visibility="{Binding JourneyCallingPoints, Converter={StaticResource CallingPointsVisibilityConverter}}" Background="{StaticResource BackgroundWhiteGradientBrush}">
<ListBox Grid.Row="1" Name="CallingPointsListBox" DataContext="{Binding}" VerticalAlignment="Top" ItemsSource="{Binding JourneyCallingPoints, Mode=TwoWay}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel VerticalAlignment="Top" Orientation="Horizontal">
<TextBlock Margin="0" VerticalAlignment="Center" HorizontalAlignment="Left" Width="210" x:Name="Destination" Foreground="Black" Text="{Binding stationName}" />
<TextBlock Margin="5,0,5,0" VerticalAlignment="Center" HorizontalAlignment="Left" Width="75" x:Name="ScheduledDepartureTime" FontWeight="Bold" Foreground="{StaticResource BackgroundBlueLightSolidColor}" Text="{Binding timetable.scheduledTimes.arrival, StringFormat=\{0:HH:mm\}}" />
<TextBlock Margin="5,0,5,0" VerticalAlignment="Center" HorizontalAlignment="Left" Width="75" x:Name="ScheduledArrivalTime" FontWeight="Bold" Foreground="{StaticResource BackgroundBlueLightSolidColor}" Text="{Binding timetable.scheduledTimes.departure, StringFormat=\{0:HH:mm\}}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<i:Interaction.Triggers>
<i:EventTrigger SourceName="ResultsListBox" EventName="Tap">
<i:EventTrigger.Actions>
<local:OpenCallingPoints />
</i:EventTrigger.Actions>
</i:EventTrigger>
</i:Interaction.Triggers>
You might look at this:
http://matthamilton.net/madprops-mvvmlight-screenconductor
I was going to suggest you look at Caliburn Micro and was searching around to see if Mvvm-Light had something similar. That article talks about that.
That's one of the things I really like about CM, when you inherit your ViewModel from Screen you automatically get OnInitialize, OnActivate, OnDeactive, OnViewLoaded, and OnViewReady methods you can override. So in this case you'd stick that logic in OnActivate.
On windows phone CM will also auto parse out the query string parameters and populate a property on your VM with them.
It looks like the screen conductor allows you to do similar with mvvm-light.
I am in serious trouble. I have listbox control in which i have many combo box. whenever select the value in combo box, i have to make other controls as hidden. i am using MVVM pattren. i am unable to get the child controls from ListBox control but i can get the ListBox control in viewmodel. How can i get these controls in viewmodel? Is it possible? I am using framework 4.0. i have shown the code below which write in view.
<ListBox x:Name="lstItems" MaxHeight="300" FontSize="11" Margin="12,0,20,38" ItemsSource="{Binding Source={StaticResource listedView}, Path=myItemsSource, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}">
<ListBox.ItemTemplate >
<DataTemplate>
<Border BorderBrush="Blue" Margin="0,4,0,4" BorderThickness="1" CornerRadius="5">
<StackPanel Orientation="Horizontal">
<Label Content="Show rules where:" Name="lblshowrules"></Label>
<ComboBox x:Name="cboShowRuleWhere" Height="20" Width="200" ItemsSource="{Binding Source={StaticResource listedView}, Path=FilterRules}" DisplayMemberPath="RuleName" SelectedValuePath="RuleId" SelectedValue="{Binding Source={StaticResource listedView}, Path=SelectedRuleName, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}" ></ComboBox>
<Grid Height="29" HorizontalAlignment="Left" Name="grid1" VerticalAlignment="Top" Width="496" Grid.Row="1" Margin="0,0,0,0">
<ComboBox Height="21" HorizontalAlignment="Left" Margin="6,4,0,0" x:Name="cboRuleCondtion" VerticalAlignment="Top" Width="212" />
<TextBox Height="20" HorizontalAlignment="Left" Margin="242,3,0,0" x:Name="txtValue" VerticalAlignment="Top" Width="245" Visibility="Hidden"/>
<ComboBox Height="21" HorizontalAlignment="Left" Margin="224,3,0,0" x:Name="cboValue" VerticalAlignment="Top" Width="205" Visibility="Hidden" />
<DatePicker Height="28" HorizontalAlignment="Left" Margin="242,-3,0,0" x:Name="dtpFromDate" VerticalAlignment="Top" Width="98" Visibility="Hidden" />
<DatePicker Height="31" HorizontalAlignment="Left" Margin="346,-3,0,0" x:Name="dtpToDate" VerticalAlignment="Top" Width="98" Visibility="Hidden"/>
</Grid>
<Button Name="cmdAddLevel" Padding="0" Margin="-1,1,0,-1" Width="75" Command ="{Binding Source={StaticResource listedView}, Path=AddLevelCommand, UpdateSourceTrigger=PropertyChanged}" BorderBrush="White" BorderThickness="1" Height="25" HorizontalContentAlignment="Center">
<StackPanel Orientation="Horizontal">
<Image Height="16" Width="16" HorizontalAlignment="Left" Margin="1,0,0,-1">
</Image>
<TextBlock Text="Add Level" FontWeight="Bold" Height="16" Width="70" HorizontalAlignment="Right" VerticalAlignment="Center" Margin="8,2,0,-1" />
</StackPanel>
</Button>
<Label Name="lblDeleteLevel" Margin="3,0,0,0" Width="75" TabIndex="7" HorizontalAlignment="Left">
<Hyperlink >
<TextBlock Text="Delete Level" />
</Hyperlink>
</Label>
</StackPanel>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Vertical" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
Please help me. once again, i want to know how to get the child control from parent control... Is it possible?
Using the MVVM pattern, you should not be referencing any of the controls directly. Alternatively, you should create a boolean property on your viewmodel that decides if various controls should be visible. Then bind the Visibility property of the controls you want to hide to this property, using a converter.
See this previous Q/A for details on visibility converters: Link
I have a TextBox in my application that i am developing and the binding is done in the xaml
I want to be able to raise an event when the binding of the TextBox Text Property is completed meaning when the text is loaded/changed through binding into the TextBox how do i achive this?
I tried TextChanged Event also Loaded Event but no luck right after the Binding is complected so how do i do it?
<ListBox x:Name="listBoxCategories" Background="Transparent" BorderThickness="0" Grid.Row="4" Grid.ColumnSpan="2" Margin="0" Padding="0" ItemContainerStyle="{StaticResource ListBoxItemStyle}" ItemsSource="{Binding ElementName=discussion_categoryDomainDataSource, Path=Data}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel x:Name="stackPanelCategory" Orientation="Vertical" Margin="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<TextBlock x:Name="TextBlockCategoryId" Text="{Binding Path=CategoryID}" />
<toolkit:Expander IsExpanded="True" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Style="{StaticResource ForumExpanderStyleRight}">
<toolkit:Expander.Header>
<TextBlock FontSize="16" FontWeight="Bold" Foreground="White" Margin="4,0,4,0" Text="{Binding CategoryName}" LayoutUpdated="TextBlock_LayoutUpdated" />
</toolkit:Expander.Header>
<ListBox x:Name="listBoxBoards" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Background="Transparent" BorderThickness="0" Margin="0" Padding="0" ItemContainerStyle="{StaticResource ListBoxItemStyle}" ItemsSource="{Binding CategoryBoards}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="0" HorizontalAlignment="Stretch" x:Name="GridBoard">
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</toolkit:Expander>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
at this line
<TextBlock x:Name="TextBlockCategoryId" Text="{Binding Path=CategoryID}" />
I want an event where when the Binding is completed i want to give a different data source for the list box under the parent stack panel so i need the binding event so when i have the catedory id int he text block which later will be hidden in the xaml ( which now is not collapsed for testing reasons )
This is a slightly peculiar thing to want to do, it might help if you tell us why you are wanting to do this?
However, with no other information to hand, I will propose a solution.
If the TextBox API events do not provide the infomation you need, try handing the LayoutUpdated event. This event fires each time layout occurs, which is typically as elements ae added to the visual tree. WHen this event fires inspect your TextBox.Text property to see if it is set.
This solved the problem for me :)
<TextBlock FontSize="16" FontWeight="Bold" Foreground="White" Margin="4,0,4,0" Text="{Binding CategoryName}" Loaded="TextBlock_Loaded" />
Loaded event in the inner Text block rather than the upper textblock because by the time this is loaded the upper text block's text is already bound so i can retrive the ID :)
I have a two pages say Main.xaml and Details.xaml.Each page has a ListBox and I am setting each of it to a collection in ViewModel(Same collection).The strange thing is that when i select an item in Details page it calls the SelectionChanged event handler on Main page and Details page.Is this a bug?
I have solved the problem by unhooking SelectionChanged eventhandler in OnNavigatedFrom() method.
EDIT
In Main.Xaml I have something like below:
<ListBox Name="MainDataListBox" Margin="8,113,8,8" ItemsSource="{Binding DataList}" SelectionChanged="MainDataListBox_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<Border BorderThickness="3" BorderBrush="#A5FFFFFF" Width="80" Margin="0,20,0,20" Height="60">
<Image Source="{Binding ImageUrl, Mode=OneWay}" VerticalAlignment="Stretch" Margin="0,0,0,0" Width="80" Height="60" Stretch="Fill" />
</Border>
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" FontSize="40" FontWeight="Normal" VerticalAlignment="Center" Margin="30,0,0,0" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
In Details.xaml also I have same kind of ListBox:
<ListBox Name="DetailDataListBox" Margin="8,113,8,8" ItemsSource="{Binding DataList}" SelectionChanged="DetailDataListBox_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<Border BorderThickness="3" BorderBrush="#A5FFFFFF" Width="80" Margin="0,20,0,20" Height="60">
<Image Source="{Binding ImageUrl, Mode=OneWay}" VerticalAlignment="Stretch" Margin="0,0,0,0" Width="80" Height="60" Stretch="Fill" />
</Border>
<TextBlock TextWrapping="Wrap" Text="{Binding Title}" FontSize="40" FontWeight="Normal" VerticalAlignment="Center" Margin="30,0,0,0" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Both of the Pages Main and Details have seperate EvenHandlers MainDataListBox_SelectionChanged and DetailDataListBox_SelectionChanged.
The problem is when i select an Item in Details Page MainDataListBox_SelectionChanged is called first and then DetailDataListBox_SelectionChanged.
Also my viewmodel is a static one in App.cs and I am setting the data context of both these pages to same viewmodel.
Thanks and Regards
vaysage
As both listsboxes were bound to the same dataset a change in the selected time in one list would have affected the other.
Obviosuly you're found a work around but I'd recommend having a unique view model for each page. If the page is just a different way of displaying the same data use a single page and alter the display as appropriate. (Creating your own visual states may be a good way to do this.)
I have a RadComboBox that i have bound like shown below
<telerik1:RadComboBox Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="3" Margin="5,2" ItemsSource="{Binding RepTypes}" DisplayMemberPath="Path=TypeName" SelectedValuePath="Value" SelectedItem="{Binding RepType, Mode=TwoWay}" >
</telerik1:RadComboBox>
When i select an Item I catch the Property Changed event, but basically the selection in the combo box stays blank.
What am i doing wrong?
Ok i made it so that it shows up now.. But i don't understand why... Or how to change it so it works for me in all cases...
<telerik1:RadComboBox Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="3" Margin="5,2" ItemsSource="{Binding RepTypes}" SelectedValuePath="Value" SelectedItem="{Binding RepType, Mode=TwoWay}" >
</telerik1:RadComboBox>
Thats what works... the Biggest difference was. I had to name a field to "Name" and then bind it and take out the DisplayMemberPath="Path=ReportName"
If that is the case then how do i tell the control what Field to Display in the dropdown?
Are you somehow changing your collection? The controls only look for the items once. So, if the page loads and then you're loading your collection of RepTypes, it doesn't update the dictionary. I'm doing something similar and I'm lazy loading my collection (as you type, I get more from the database).
<t:RadComboBox x:Name="RepTypeComboBox" Margin="0,1"
t:TextSearch.TextPath="TypeName"
ItemsSource="{Binding Path=RepTypes, Mode=OneWay}"
SelectedValue="{Binding Path=Reptype, Mode=TwoWay, NotifyOnValidationError=True}"
IsEditable="True"
Grid.Column="1"
Grid.Row="2" TabIndex="1">
<t:RadComboBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal" >
<TextBlock FontWeight="Bold" Text="{Binding Path=TypeName, Mode=OneWay}" Width="75"/>
<TextBlock Text=": " />
<TextBlock Text="{Binding Path=address1, Mode=OneWay}" />
<TextBlock Text=" " />
<TextBlock Text="{Binding Path=address2, Mode=OneWay}" />
<TextBlock Text=" " />
<TextBlock Text="{Binding Path=citystate, Mode=OneWay}" />
<TextBlock Text=" " />
<TextBlock Text="{Binding Path=zip, Mode=OneWay}" />
</StackPanel>
</DataTemplate>
</t:RadComboBox.ItemTemplate>
</t:RadComboBox>
If you want ReportName to be shown as your display member, you only have to put it this way:
<telerik1:RadComboBox ItemsSource="{Binding RepTypes}" SelectedValuePath="Value"
SelectedItem="{Binding RepType, Mode=TwoWay}" DisplayMemberPath="ReportName">
</telerik1:RadComboBox>
You're putting an extra "Path=" that's only confusing the XAML parser.