Save draft and submit final - form options

Need help
1

In order for my users to submit their forms, all of the fields must be complete. However, there’s a lot of fields, so I’d like them to be able to save the data as a draft and continue later.

I tried to achieve this by having two buttons: a save-draft button and a submit-final button, with a “status” field in the database item.

Ideally, I’m trying to accommodate the following 3 scenarios:

  • user presses save-draft > inputs are saved to database
  • user presses submit-final AND no inputs are empty > inputs are saved to database AND field “status” is set to “final”.
  • user presses submit-final AND some inputs are empty > inputs are saved to database BUT field “status” is not set to final. The user is informed that all fields must be completed.

In my current attempt, I have two workflows:
*When the user presses save-draft, it saves a state called “is_final” as “no” and then calls make-changes-to-a-thing to save the data in the database.
*When the user presses submit-final, it saves the “is_final” state as “yes” and then calls make-changes-to-a-thing to save the data in the database and also sets the field “status” to “final”.

I also have conditional formatting to accompany this:
*when is_final = yes, every field is set as must not be empty = checked.
*when is_final = no, every field is set as must not be empty = unchecked.

However, I have now realised that the conditional formatting is only being updated when make-changes-to-a-thing is successful in the workflow (I assume because this resets inputs?).

This means that, when I press the submit-final button, it sets the “is_final” status as “yes”, calls make-changes-to-a-database successfully, updates the inputs, and only then is the “is_final” state change recognised by the conditional formatting of the inputs.

Of course, if the user presses this when not all fields are complete, this breaks the save-draft functionality because all fields have been set to “must not be empty”, so the state change at the start of the save-draft workflow (“is_final” = no) will not be recognised by the conditional formatting unless all fields are complete.

I’m aware I’m probably over complicating things, so I’d really appreciate any ideas or solutions you may be able to offer. Any and all suggestions are welcome.

I didn’t like resorting to auto-binding as it doesn’t give me complete control but perhaps it is my best option here?

Thank you in advance.

2

This may be a lot of work, but I personally would do something like this.

  1. For each field that you require for a “final save”, add a little bit of text right below the field that says something like “this field cannot be blank if submit a final” (or something like that). Make the text not visible upon page load.

workflow 1: “save final” button is clicked and requiredfield1 is not empty and requiredfield2 is not empty and requiredfield3 is not empty…and so on (like I said, it may be a lot of work).

The action to do in this workflow is:
create your new “Thing”.

workflow 2: “save final” button is clicked and requiredfield1 is empty

The action to do in this workflow is:
set the page-level custom_state “failure” to “requiredfield1”.

workflow 3: “save final” button is clicked and requiredfield2 is empty and “failure” is not empty

The action to do in this workflow is:
set the page-level custom_state “failure” to “requiredfield2”.

workflow 4: “save final” button is clicked and requiredfield3 is empty and “failure” is not empty

The action to do in this workflow is:
set the page-level custom_state “failure” to “requiredfield3”.

Back to Step 1 way at the top. Set a condition behind each of these little text fields.

For the first one: when the custom_state is “requiredfield1”, make the text visible.

For the second one: when the custom_state is “requiredfield2”, make the text visible.

For the third one: when the custom_state is “requiredfield3”, make the text visible.

…and so on.

The behavior you’re aiming for is if the user clicks “save”, your app will highlight THE FIRST required field that was left empty.

If the user fills it in then clicks “save” again, it will highlight the NEXT empty required field.

At least, that is how I think it will work. Like I said, it’s a lot of typing/clicking but I think this would do what you want.

1 Like
3

Thanks mate. Although that is a lot of work, I think it would at least work.

I wish there was a way to force the app to recognise set-state to yes/no prior to making changes to the database. If I delete the make-changes actions from the workflows, the set-state works exactly as expected but if any actions are added after the set-state action, the set-state action isn’t recognised until after those actions are complete! There has to be a way around that but I can’t seem to figure it out.

EDIT…

How I eventually did this:

I used autobind to allow the saving of all inputs automatically.
Then on my submit button, I created a workflow to save all of the fields AGAIN. This workflow, as expected, only completes if all required fields are complete. If it reaches the end of the workflow, a final action saves an “is_submitted” state (true if all fields were completed, else false). This status is then used to inform the user if the submission was complete or not.

4

Woah, that’s really not good.

5

Thank you the feedback but it would have been more beneficial if you had provided some constructive insights or alternative approaches to tackle the problem, rather than a 5-word critique. This is a “Need Help” forum after all, and that’s why I posted here - to ask for help.

I realise my solution was less than ideal, but I decided on that quick and dirty method simply to get the first prototype up and running, but I still need to settle on a final solution.

6

Sorry about that. I read it as that being the solution so wanted to put it out there that it’s not.

I’m not following exactly what the issue is and if I’m wrong please summarize the exact issue but heres my thoughts:

Have 3 buttons. Draft and final1 and final2
Final1 sends data to db. Final2 gives user message that not all fields are completed and appears on page load and is hidden when final1 is visible.

Final 1 looks like final 2 in every way just has a different behavior and is only visible when all required fields have a valid input.

7

Yes, that is the outcome I want, but the question was how to achieve that outcome.

There is no explicit way to tell an element to be visible only when all required inputs are valid. Additionally, in order for the draft button to work, the required fields need to be temporarily set as not-required, otherwise it won’t save everything. And in order for the submit functionality to work, the fields DO need to be required.

There are a couple of extremely convoluted ways of doing this, but I was hoping there would be more elegant solutions.

8

There is just not using valid but each input thats required isn’t empty. That’s much better than the current setup.

The best would be to have a default validation text stored in a custom state on each required input / group. When the input is a valid input, null out the custom state. Then the true submit button is only visible when all such inputs are empty. One advantage of this is when the user clicks the dummy submit button you can change a state on the overall form of show validation to true so that all validation texts appear. Another is if certain fields are only required based on certain conditions you just add that to the validation text conditional and don’t have to get overly complicated in the conditions for the submit button

9

This topic was automatically closed after 70 days. New replies are no longer allowed.