Customize Error Message for Datacard

[JMAFO]

I'm using a PowerApps form linked to a SharePoint list. I have made a few fields required, but whenever I test the validation by leaving them blank, the fields don't have error messages underneath them and error messages only populate the top banner of the canvas app. I noticed that the text property of the datacard error message is set to 'Parent.Error' and whenever I change this to a custom text, the text is visible even when there is no error. I also noticed that the visible property is set to ''Parent.DisplayMode=DisplayMode.Edit". No idea on how to change this. 

How can I make a custom error message only display when the error is thrown? 

[RandyHayes · Accepted solution]

@JMAFO 

There are a couple of considerations you need to make in regard to error handling - the first is "when".  When do you want to deal with errors?  Before the form is submitted or after?  I would suggest to consider dealing with them prior to submit.  Don't even let a user submit a form unless there is a valid set of data to be submitted. 

The next is, how do you want to deal with that scenario?  Error messages, disabled controls, notifications, etc.

There are lots of different ways to go about it, but you have full control on how you want it to happen.

Let's take a scenario where you want to validate before submit and yet provide feedback enough to let the user know what they need to do.

First, it seems that Edit forms kind of know what they are when first created, but don't update themselves when the underlying datasource is changed.  So, if you create a form and then change fields to be required.  The form will not update to reflect that.  If you remove the fields from the form and add them back in they will then reflect the change (caveat - this will only happen after you get out of the design and back in - even a refresh of the data source while you're in it doesn't seem to update that properly)

SO - that will fix the issue of your forms not providing information about the required fields.  (This might be all you need at this point)

Next - the error messages are pretty generic.  You can change them as you have found...set the text as you need.  Now with that, you also need to set (with the Visible property) when that message is displayed.  By default, the Text of the message is set to the Error of the Parent.  This will be whatever the datasource returns as an error.  The visible is set whenever you're in edit mode.  On the label, you can 1) customize the text property and then 2) set the Visible property to (!IsBlank(Parent.Error) && Parent.DisplayMode=DisplayMode.Edit).  

At this point, you will have a custom error message and it will only appear when there is an error.  

It's still a little messy because, you will get this error then for any error that occurs and you'll also get the notification bar about it.

If you want to go the next step and get rid of the above mess...then consider disabling the submit button until the form is validated.  You can actually do it a couple ways.  One is to set a formula for the Disabled property of the button/icon.  The other way is to put in some logic to the formula of the button to 1) check for valid  2) if not valid, set a variable and done 3) if valid reset variable and submit the form. Then, with that variable, you can use it for the visible property of the error messages to "turn them on" so the user knows.

I realize that last concept paragraph if high-level concept.  I didn't go much deeper because we might have solved your issue at the first solution.  So, if this helps, I am hopeful.  If not, please post back and provide an area you are wanting more detail or having more problems.

[JMAFO]

Your suggestion was very helpful. I am used to doing a lot of web design validation and the structure of powerapps throws me off a little. I believe using the errors before the submit would be the preferred method, for the users that will be using this form aren't exactly computer savy and I think avoiding the complex validation would be just fine. Your suggestion about updating the datasource, removing the fields, and then readding them worked. I find it very annoying that forms do not update, even after you refresh the datasource connection. Removing fields that I have customized and then readding them back in, just to customize them all over again, becomes very tedious. However, I guess this is just something you have to plan ahead for as a powerapps designer.

Thanks for you, RandyHayes, for your help and I appreciate the time you took in helping me, I do love powerapps but some functionality just seems to make me scratch my head at times. 

[ElvinV]

Amazing!!! I have been online for days and you just make me cry with the advice/solution !! 

[indhaa]

Hi Randy,

My form is prompting the default SharePoint error warning. In addition to this i would like to add other data validation and show the error respective to it in the same way. For example if the email field is empty when i press the submit button it will prompt the error " Email is required". I also like it to prompt if it is an invalid email too

I don't like to disable the submit button because users tend not to find the mistake in their input. My experience, so would like to prompt the error if the form is invalid. Any input on this?  

[PaulSaker]

What I do for this custom error handling:

On the Page with the form: OnVisible, create a context variable to hold a custom message

UpdateContext({emailErr:Blank()});

On the ErrorMessageLabel for the DataCard: set the Text to 
Coalesce(Parent.Error,emailErr) - this takes the first NON-Blank error
In the OnChange event for the field to show the error for

If(<<Logic to determine if error or error message>>, UpdateContext({emailErr:"Invalid Email Address"}), UpdateContext({emailErr:Blank()}))

I then also use the disable of submit by checking that there are no Non-Blank error messages

[indhaa]

Hi

Thanks for the response. This was an old ticket and I have been able to figure it out to give the msg I want without disabling the submit button . I didn't add a new label and just ONLY use the Error card that is already there with the data card. In the text property I use a condition to display what to display depending on the error and in the Update property of the data card I added the condition it will only update if condition is true too. 

[venkata-aditya]

@RandyHayes - I'm trying to solve the problem in a different way : I want the validation to be built when the form is actually submitted. So I'm putting this formula in the OnSelect property of the Accept icon - 

If(
DataCardValue14.SelectedDate >= Today() + 7,
SubmitForm(EditForm1),

Now, I'm struggling with setting the error message text label to my desired error text. As a temporary measure, I'm using the Notify() function. But I specifically want to highlight the error against the data card in a bright red text. How do I solve this?

[indhaa]

Hi,

I have been able to do the customization of the error without a label. The Submit Icon check the Required Property, Update Property of Datacard and will prompt the error as per the Datacard Error msg. So you don't have to add an if condition in the On Select of the Submit button. Just keep it as SubmitForm(EditForm1)

So on your Required Property, you can set to true or false up to your requirement. below my example

 In the Update Property you can set when to take the value. 
As per your example If(DataCardValue14.SelectedDate >= Today() + 7, DataCardValue14.SelectedDate)

In the ErrorMessage , you can set as per your example

If(IsBlank(DataCardValue14),Parent.Error, DataCardValue14.SelectedDate <= Today() + 7, " cannot be less than x days")

 

Hope this help

[DariuszSzwabo]

Anyone knows why the errors are displayed in top of the page instead of being part of a form (displayed inside a form) ? Error Message element is part of a card, common sense would expect it will be visible inside a card....