Disable Submit button until ALL required fields have values

[ChadVKealey]

So, I'm building an App with a request for that has about 30 fields, 20 of which are required. I'd like to disable the Submit button until each of the required fields has a value. I've done this in other Apps (using this pattern) where there are fewer fields (up to 7 or 😎 and it ends up being a kind of hideous formula. So, I'm hoping there is another way to accomplish this goal without specifying each and every "required" field in the formula. I thought there was a "form.Required" property (that would evaluate to true when all required fields were populated), but there is not (may be good for the Ideas forum). Also, some of the fields are conditionally required (e.g.: "Tech Support Needed?" (Yes/No toggle), if Yes, then "Tech Support Details" text field is required), so adding in that logic to one gigantic formula would just get really unwieldy. 

Back in the InfoPath days, I often worked around this requirement by setting a hidden checkbox field on each screen/view in the form, then collectively checking each of those checkbox values at the end. However, I'm not sure that same approach would work in PowerApps since it uses declarative logic vs. the imperative logic used in InfoPath.

[RandyHayes]

@ChadVKealey 

Unfortunately, you'll most likely need to consider a formula that includes all your required fields and any logic necessary to validate the fields and thus allow a submit button to be enabled.

I often do this with a hidden Toggle control on the screen.  Set the Default property to your formula then have the submit button key off of the toggle.

So, let's say we have 20 required fields on the screen.  We can set the Default property on the Toggle (tglValidForm) to:

!IsBlank(TextInput1.Text) &&
!IsBlank(TextInput2.Text) &&
!IsBlank(TextInput3.Text) &&
...<etc>...
!IsBlank(TextInput20.Text) &&
// and even logic if needed - ex. if Amount is entered in input5, then make sure input15 is more than 20
(If(TextInput5.Text="Amount", Value(TextInput15.Text)>20, true)) 

With this, your tglValidForm control will become true when the fields are all valid and then you can use this on the submit button, or any other control you need.

Submit Button -> DisplayMode Property:

If(tglValidForm.Value, Edit, Disabled)

The biggest advantage is that you do your "valid form" logic in ONE place only and, at least, for maintaining the app, you will know where to change if needed.

I hope this is helpful for you.

[ChadVKealey]

Thanks, @RandyHayes , that's kind of how I did it in InfoPath. It seems the problem is still the same. Well, not the problem really, but the solution being a long and potentially error-prone formula.

I actually decided to try a different approach with this App and provide the user some valuable feedback. Each "page" of the form is accessed by clicking the appropriate button in a gallery. Next to that button, I placed an icon and conditionally set which icon to use (either checkmark for "all good" or the warning triangle for "invalid or missing data"). So, as the user completes the form, they'll be able to see all those checkmarks and know that they've done things right. In the end, I'll key the displaymode of the Submit button dependent on all of those icons being checkmarks. The only problem I foresee is that there are a couple of screens where there aren't "required" fields, so they show the checkmark by default. For example, the "Publicity" screen has a toggle for "Request Publicity", which defaults to No. All of the other controls (for requesting specific types of publicity - flyers, info screen display, etc.) are also toggles that default to No. I see a lot of folks (Law Students will be filling this out) skipping over that section when they submit their request and coming back later to ask for publicity. I think maybe I'll default the "Request Publicity" to Yes, so they either need to specify what kind of publicity or "opt out" of it.

Anyway, this is what the screen button/icon setup looks like:

[RandyHayes]

@ChadVKealey 

Strange that I received an email with your reply to this post, but yet it is not here.  Not sure if you deleted your response.

Anyway - taking it from the email - Yes, if you want to have toggles that are required, then you need to rethink that.  I often replace them with Radio controls.  They can be set to no value (and thus "required" and invalid until checked) and then can be used for the rest of the logic.  It's just one choice, there are other workarounds for it.

[jebalert]

I came across this the other day

If you have a need to make sure all of the required fields are filled out before enabling a submit button, add this formula to the DisplayMode property on the button (where FormName is your actual form name). 

If(FormName.Valid,DisplayMode.Edit,Disabled)

[CW]

This worked for me thanks, it wasnt explicitly defined in the example but I had to wrap the toggle default swection in an 'If" statement in order to make it work.

[willgonds]

To disable the button that contains the "SubmitForm" function until all required fields in the form are filled in PowerApps, you can use the "Form Validation" feature of PowerApps. Here's a practical way to do it:

1. Select the form in PowerApps and go to the "Settings" tab on the top toolbar.

2. In the "Form Options" section, enable the "Form Validation" option.

3. Click "Edit" to add the necessary validation rules for each required field. For example, you can add a validation rule to check if a field is empty or if it contains a valid value.

4. After adding all the necessary validation rules, go back to the "Design" tab and select the button that contains the "SubmitForm" function.

5. In the "Properties" section on the right, locate the "Disabled" property and set the following expression:

If(FormName.Valid, false, true)

Replace "FormName" with the name of your form. This expression will disable the button until the form is valid and all required fields are filled.

1. Save and publish the changes to your app.

With these steps, the "SubmitForm" button will be disabled until the form is valid and all required fields are filled, helping to ensure that data is entered correctly before it is submitted

From chatGPT

[ambi95]

thanks this was helpful, except there is one minor change: 

If(FormName.Valid,DisplayMode.Edit,DisplayMode.Disabled)

[Varinder_Singh]

This helped