Get rid of button red border in WPF?

Question

I am re-asking a similar question that has been asked. The answers didn't seem to work in my particular case. I have included details.

I have a ComboBox and within the ComboBox each item has a ToggleButton. When I click on the ToggleButton there is a red outline that I want to get rid of. How can I remove the red outline around the button? In the ControlTemplate I am setting BorderThickness=”0”, BorderBrush=”Transparent”, Focusable=”false”. These were all things that other posts had mentioned.

<!--Xaml for ComboBox: -->
<TimestampComboBox 
  Style="{DynamicResource PlotComboBoxStyle}"
  IsSynchronizedWithCurrentItem="True"
  …
>
  <TimestampComboBox.ItemsSource >…
  </TimestampComboBox.ItemsSource>
  <TimestampComboBox.ItemTemplate>
    <DataTemplate>
      <StackPanel Orientation="Vertical">
        <DockPanel Width="174" LastChildFill="False">
          <ToggleButton DockPanel.Dock=
            Style="{DynamicResource SampleAddToggleButtonStyle}"
          >
            <ToggleButton.Content>
              <Rectangle Height="10" Width="10"/>
            </ToggleButton.Content>
          </ToggleButton>
        </DockPanel>
      </StackPanel>
    </DataTemplate>
  </TimestampComboBox.ItemTemplate>
</TimestampComboBox>

<!--SampleAddToggleButtonStyle: -->
<Style x:Key="SampleAddToggleButtonStyle" TargetType="{x:Type ToggleButton}">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type ToggleButton}">
        <Border Name="border" BorderThickness="0" BorderBrush="Transparent">
          <ContentPresenter Content="{TemplateBinding Content}" />
        </Border>
        <ControlTemplate.Triggers>
           …
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

Answer 1

Sorry, but I think you don't understand what's happening. Let me start over.

What you see is most probably an effect of error checking that WPF performs in certain places. When a 'validation step' fails during binding operations (i.e. you have entered KAJSHDKAS in a textbox that is bound to double variable), WPF sets "validation error" flag on a control. By default it is visualized by simple thin red outline around that field.

It means that something has failed in your code. It's serious. You must check what exactly has happened and reove the error.

Often, it's a result of some exception being thrown from some converter or some binding. Check the Debugger's Output panel and look if there are any "First chance exceptions" reported. or maybe even some stacktraces. If you see ANY of them happening at the time when "red outline" shows up, you must simply fix the problem so that the exception is not raised, and red outline will go away.

If you don't fix it, and if you just hide the error-notification, then at some later point of time you may discover that some bindings ceased to work, or that some styles are not applied, or that some UI elements are not drawn correctly (i.e. they are replaced by big red X error mark).

If there are no exceptions visible in the output log, then look for any messages about failed bindings. When a Binding fails to convert some value to some property or vice-versa, it also may cause error-flag to be set. It often does not end with exception flying around, but a simple message will be written in the log, and it will precisely explain which binding on which control has failed. In this case you will need to trace what was the offending value that was not-convertible to the bound property, and you will need to fix your code to ensure that only convertible values are provided.