Unbreakable Unbreakable - 2 months ago 15
Vb.net Question

How to disable the date picker on "cancil" button click

I am learning wpf and xaml. And I want to disable the showing of date picker when cancil button is clicked. How can I achieve that in XAML using style. So when the red cancil button is clicked I want to hide or disable the date picker. Please help me.

Below is what I have till now

<UserControl x:Class="ucWorkOrderActivity"
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"
mc:Ignorable="d" Height="74" Width="570" Background="White" BorderBrush="Gray" BorderThickness="1" Loaded="UserControl_Loaded" MouseDoubleClick="UserControl_MouseDoubleClick">
<Grid>
<DockPanel Name="dkpControl" Margin="10,0,25,0" >
<StackPanel Name="stpMoveButtons" Orientation="Vertical" DockPanel.Dock="Right" HorizontalAlignment="Right" Margin="5,0,0,0">
<Button Name="btnUp" Click="btnUp_Click" Height="25" Width="25" Content="▲" ToolTip="Move Action Up" IsEnabled="{Binding Path=IsUpEnabled}" Margin="0,5,5,10" />
<Button Name="btnDown" Click="btnDown_Click" Height="25" Width="25" Content="▼" ToolTip="Move Action Down" Margin="0,0,5,10" IsEnabled="{Binding Path=IsDownEnabled}" />
</StackPanel>
<DockPanel DockPanel.Dock="Top" Margin="0,0,5,0" >
<TextBlock Name="txbDesc" Text="{Binding Path=Description}" Width="150" TextTrimming="CharacterEllipsis" Margin="10,5,5,5" VerticalAlignment="Top" />
<DockPanel Margin="5,0" HorizontalAlignment="Right" DockPanel.Dock="Right" Width="358" >
<TextBlock Name="txbCostLabel" Text="Cost: " DockPanel.Dock="Left" VerticalAlignment="Top" Margin="46,5,0,5" />
<TextBlock Name="txbCost" Text="{Binding Path=AmountCharged}" TextAlignment="Right" DockPanel.Dock="Left" Width="50" Margin="5" VerticalAlignment="Top" />
<DatePicker Name="dtpCompleted" DockPanel.Dock="Right" Height="25" VerticalAlignment="Top" Margin="0,1,0,0" SelectedDate="{Binding Path=EndDate}" Width="90" />
<TextBlock Name="txbStatus" Text="{Binding Path=Status}" DockPanel.Dock="right" HorizontalAlignment="Left" Width="60" Margin="45,5,30,5" TextAlignment="Left" VerticalAlignment="Top" />
</DockPanel>
</DockPanel>
<DockPanel DockPanel.Dock="Bottom" Margin="0,0,5,0" >
<Image Name="imgLocationChange" Margin="25,0" DockPanel.Dock="Left" Height="24" Source="/SMS_Main;component/Resources/UnitMoveLoc_24.png" Visibility="Hidden" />
<TextBlock Name="txbCharge" Text="{Binding Path=ChargeWhen}" Margin="70,0,0,0" VerticalAlignment="Center" />
<Button Name="btnComplete" Height="26" Width="26" DockPanel.Dock="Right" HorizontalAlignment="Right" Click="btnComplete_Click" ToolTip="Complete Action" >
<Image Source="/SMS_Main;component/Resources/OK_24.png" Margin="2" />
</Button>
<Button Name="btnCancel" Height="26" Width="26" DockPanel.Dock="Right" HorizontalAlignment="Right" Click="btnCancel_Click" ToolTip="Remove Action">
<Image Source="/SMS_Main;component/Resources/Cancel_24.png" Margin="2" />
</Button>
<Button Name="btnRevert" Height="26" Width="26" DockPanel.Dock="Right" HorizontalAlignment="Right" Click="btnRevert_Click" IsEnabled="{Binding Path=CurrentlySaved}" ToolTip="Revert Change">
<Image Source="/SMS_Main;component/Resources/Undo_24.png" Margin="2" />
</Button>
<Button Name="btnEdit" Height="26" Width="26" DockPanel.Dock="Right" HorizontalAlignment="Right" Click="btnEdit_Click" ToolTip="Edit Action" >
<Image Margin="2" Source="/SMS_Main;component/Resources/Config_24.png" />
</Button>
<TextBlock Name="txbAssignedTo" Text="{Binding Path=AssignedUser}" VerticalAlignment="Center" DockPanel.Dock="Right" HorizontalAlignment="Left" Margin="95,0,10,0" />
</DockPanel>
</DockPanel>

</Grid>
</UserControl>


enter image description here.

Answer

You can add an event trigger to the cancel button:

<Button Name="btnCancel"  Height="26" Width="26" DockPanel.Dock="Right" HorizontalAlignment="Right" ToolTip="Remove Action" Content="Cancel">
    <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
            <BeginStoryboard>
                <Storyboard>
                    <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsEnabled" Storyboard.TargetName="dtpCompleted">
                        <DiscreteBooleanKeyFrame KeyTime="0:0:0" Value="False"/>
                     </BooleanAnimationUsingKeyFrames>
                 </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Button.Triggers>
</Button>