ToggleButton not unchecking when clicked - wpf

Question

I have a ToggleButton that is malfunctioning. As I understand it, a ToggleButton should go checked when clicked then unchecked when clicked again.
The ToggleButton in this example does not. Clicking it just sets it to checked again. Any Ideas why?
<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
<ToggleButton Width="100" Height="35" Name="btnAddLinkComment" >
<CheckBox Content=" Comment" FlowDirection="RightToLeft" IsHitTestVisible="False"
Focusable="False" IsChecked="{Binding ElementName=txtLinkComment, Path=Text}"
Name="chkHasComment" Margin="5"/>
</ToggleButton>
<Popup IsOpen="{Binding ElementName=btnAddLinkComment,Path=IsChecked}"
PlacementTarget="{Binding ElementName=btnAddLinkComment}" Name="popAddCommentLink"
AllowsTransparency="True" StaysOpen="False" PopupAnimation="Fade" HorizontalOffset="-50"
VerticalOffset="50">
<Border BorderBrush="#FF000000" Background="LightBlue" BorderThickness="1,1,1,1"
CornerRadius="8,8,8,8" Padding="5">
<Grid Background="LightBlue">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="80"></ColumnDefinition>
<ColumnDefinition Width="200"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock TextWrapping="Wrap" Foreground="Black">Enter Link Comment:</TextBlock>
<TextBox Grid.Column="1" Name="txtLinkComment" Width="200"></TextBox>
</Grid>
</Border>
</Popup>
</Grid>
</Page>

Answer 1

I guess this happens due to popup being bent to the btnAddLinkComment.isChecked property. I believe what happens is that you're clicking on the button when pop is shown which makes it to close and sets button's IsChecked field to false which puts the button into untoggled state; then the click gets processed by the button itself and since it not toggled it becomes toggled and popup gets shown again. I guess you could resolve the issue by removing the binding and do some handling in code; smth like this:
btnAddLinkComment.Click += btnAddLinkComment_Click;
popAddCommentLink.Closed += popAddCommentLink_Closed;
private void btnAddLinkComment_Click(object sender, RoutedEventArgs e)
{
if (popAddCommentLink.IsOpen && btnAddLinkComment.IsChecked == false)
popAddCommentLink.IsOpen = false;
else if (!popAddCommentLink.IsOpen && btnAddLinkComment.IsChecked == true)
popAddCommentLink.IsOpen = true;
}
private void popAddCommentLink_Closed(object sender, EventArgs e)
{
btnAddLinkComment.IsChecked = false;
}
hope this helps, regards

Answer 2

I am not entirely sure what you want to accomplish but the code below might be a step in the right direction. Please elaborate!
<Window x:Class="ToggleButtonSpike.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300"
xmlns:local="clr-namespace:ToggleButtonSpike">
<Window.Resources>
<local:TextToBool x:Key="StringToBool"/>
</Window.Resources>
<StackPanel>
<ToggleButton Name="Toggle" >
<CheckBox IsHitTestVisible="False"
Content="{Binding ElementName=Comment, Path=Text,
UpdateSourceTrigger=PropertyChanged}"
IsChecked="{Binding ElementName=Comment, Path=Text,
Converter={StaticResource StringToBool}}"/>
</ToggleButton>
<Popup IsOpen="{Binding ElementName=Toggle, Path=IsChecked}"
PlacementTarget="{Binding ElementName=Toggle}">
<StackPanel>
<TextBlock Foreground="White">
Enter comment:
</TextBlock>
<TextBox Name="Comment"/>
</StackPanel>
</Popup>
</StackPanel>
</Window>
using System;
using System.Windows;
using System.Windows.Data;
namespace ToggleButtonSpike
{
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
}
}
public class TextToBool : IValueConverter
{
#region IValueConverter Members
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
return !string.IsNullOrEmpty((string)value);
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
}
#endregion
}
}

Answer 3

When you click on toggle button. It will checked or unchecked, please kindly remember that. At the first click on it, it will be focused.
Please try:
<ToggleButton Focusable="False"/>
Hope to help you