WPF ValidationRule and DataTrigger to disable Submit button

Question

In the following XAML, I am using MultiDataTrigger and ValidationRule in trying to keep Submit button disabled until the two textboxes have valid values (alphanumeric) entered in them. This works working fine, in that when value is invalid (say, some@test) button gets disabled and when you make that value valid (say, sometest) it enables the button.

Issue: But when you start the application it displays the button as Enabled - that defeats the whole purpose since you can submit the button even if you have not yet start entering the textbox values.

Question: What I may be missing here and how can we fix it?

Remarks: If you look (and I tested) the MultiDataTrigger example in the first link above, you would notice (as the two images show there) that the initial value (as expected) is shown as Unverified with red color, and when you check the two checkboxes the text value changes to Verified with green color. So, it seems I'm clearly missing something in XAML above. Please note that I have set the initial state of the button to .


    
        
        

        
            
                
                
            
        
        
        
    
    
        
            
            
            
        
        
            
            
        
        First Name:
        
            
                
                    
                        
                    
                
            
        

        Last Name:

MyDataSource.cs:

public class MyDataSource
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
}

AlphanumericOnlyValidationRule.cs

using System.Windows.Controls;
using System.Linq;
using System.Globalization;

namespace WPF_DataValidation
{
    public class AlphanumericOnlyValidationRule: ValidationRule
    {
        public override ValidationResult Validate(object value, CultureInfo cultureInfo)
        {
            string sVal = value as string;

            if (string.IsNullOrEmpty(sVal))
            {
                return new ValidationResult(false, "Please enter some text");
            }

            if (!sVal.All(char.IsLetterOrDigit))
            {
                //Note: this will also return false if text has a blank space
                return new ValidationResult(false, "This field must contain alphanumeric characcters only");
            }

            return new ValidationResult(true, null);
        }
    }
}

OBSERVATION

The issue seems to be that when app loads first time it probably first does disable the submit button. But the value Validation.HasError in the MultiDataTrigger.Conditions block of the XAML assumes there is no validation error (since the app has just been loaded and user has not yet taken any action), and hence it enables the submission button again. This is just my observation based on the following XAML that I used by modifying the MultiDataTrigger example as shown below. Here I just changed the TextBlock to Button along with corresponding values and noticed that initially the button is disabled (since the checkboxes by default are unchecked), and when you check both the checkboxes, button gets enabled (as expected). So, we probably need to see how (in the above XAML) we can disable the button when app initially loades.

Modified XAML from the online MiltiDataTrigger Example:

mdziadowiec · Accepted Answer

It is expected behavior since the validation occurs

(...)when the value of a target is transferred to the binding source property.

source

In your case to force the validation before even updating the value of the controls you can add ValidatesOnTargetUpdated="True" property to the ValidationRule and it will trigger validation when the target of the Binding is updated.

ValidationRule.ValidatesOnTargetUpdated - MS DOC

WPF ValidationRule and DataTrigger to disable Submit button

Answers (1)

Related Questions