Multi-step form

Hello,

In my app I would like a user to be able to do this:

  • Input a date + some other details. Click next.
  • Input more information and refer back to the date in step 1
  • Input info in a final screen and click submit

I havent used glide for a while and am using the webapp builder. The plan was to have a “formStep” variable and have buttons that will change that to display / hide containers containing form inputs. This seems to work OK but i can’t work out how to refer back to the date added in step 1. I suspect it is because the form has not yet been submitted and is not in the database?

Hopefully this is a common issue but i couldnt find an answer. Would love to understand the best approach to multi-step forms.

Thanks!

You may want to consider creating a custom form. Creating multi-step “pages” within a native form can be tricky. Especially if you have required components that become hidden. I’d have to look, but in some cases you do have access to Screen Values.

In any case, I prefer and do multi-page forms using the custom method because it writes values to user specific columns in the table, and it’s easier to access them.

2 Likes

Hi, thanks for this.

Can you explain what you mean by custom forms? I cant see an option to create that and the app you linked to doesnt really explain what is happening. Sorry i have been away for a while and am probably missing something you are explaining - if there are any tutorials / youtube vids you can link to I would really appreciate it.

Thanks again.

A custom form is just a detail screen that’s designed to act like a form and uses entry components linked to user specific columns as the temporary placeholders for the data. Once you are done filling out the form, you can have a button with a custom action that will first have an Add Row action that will take those user specific column values and write them to a different table. You can then follow that action with a Set Column action that will clear the user specific columns so it’s ready for the next time you fill out the form. It’s an alternative that many of us use in place of Glide’s native forms. There isn’t any official glide documentation regarding this. The thread I shared is the go-to thread to explain this. I recommend copying the app and taking a look at it to see how it’s set up in the builder.

4 Likes

AH! Got you - thanks! Sorry I was looking for a “custom form” component. So if i alreay have my table i should make a new table with all the cols as user specific values, then the final “action” adds a row to the real table, sets all user specific vals back to blank and shows a success notification?

1 Like

Yes, that’s the right idea. Make sure you have a column with a fixed value to initiate a row to house your user-specific inputs.

4 Likes

Sorry would you mind explaining that? Not sure i follow!

If you create a new table, you have to make sure it has at least one data row. Your details screen needs a row to attach to. Otherwise, all the entry components will be grayed out because the screen is not attached to a row and there is nothing to update.

3 Likes

Hi Jeff,
I’m quite sure I’ve discussed this with you or with @Darren_Murphy on another topic, but I cannot find it.
Is there a way to interlink custom forms to one another?
An example:
A custom form is used to update client details. It also allows the user to send a message/email to the client. To setup the message we need some specific details, such as email address, email subject, etc.
Now, on another form, we also have an option to send an email to the client.
The section regarding email includes quite a lot of input rules, mandatory fields, etc. As of now, we need to duplicate the entire email “section” to all forms that need it. This entails copying not only the components, but also the columns. Columns are not copyable if they’re within a Glide Table and/or USC. Even if everything was copyable, and easily done so, we’re still risking errors and mismatches between forms using this section.
Can we simply create another customs form, for example named “Send Email”, and then divert user to this form whenever we want to allow them to send an email? This form will be on another working table, all USC.
I believe it’s possible, but I’m not sure if there are specific rules to follow to make sure we always maintain data integrity between custom forms.
What do you think?
Thanks

This layout will remain unique to this particular link-to-screen action – meaning that you will be able to link to the same screen multiple times and show that screen in different ways.

I believe that I read somewhere here that these referrals to the “same screen” from different directions don’t always work. Am I mistaken?

I’m trying to visualize what you want. The best I can do is give you the general rules for how things work in glide, and then you can decide what’s the best method to get what you want.

My general rule is that a details style layout screen, will attach the design of the layout to the table as long as you are on any level below a top level, such as a tab or a ‘show new screen’. I consider Tabs and New Screens to be a top level view, which can have an independent details layout. To explain this further, if you have an inline list and you click on each item to view it’s details, then the details view you see is a second level view and attached to the the table. So wherever you put a list to the same table throughout your app, the details layout for each list item will be the same however you get to it. That’s because the details view from a list is not a top level view.

If you use a ‘Show New Screen’ action, then it truly does just that. If gives you a new screen independent of any existing screens for any instance where you apply the ‘Show New Screen’ action. If you apply the action to a list, then each list item will happen to display the same screen (this is separate from the Show Details action, which has the layout attached to the table), but if you apply the action to buttons, then each button will have independent screens, so the resulting screen from each button will be different and independent of the others.

I’m not sure I follow this statement. If you are referring to the same table, then I don’t know why you would need to copy any columns. Theoretically, you could have multiple different custom forms referring to the same table if you wanted.

If I follow your question correctly, you want multiple different custom forms that have some parts that do the same thing (sending an email) and you don’t want to have to duplicate any logic. I think what I would do in this case, is either have each custom form refer to the same table, or have a separate table just to handle the email functionality. Then have a single relation that links your custom form table to the email table. Then navigate to the email form through a Show Detail action that navigates through the single relation. That way you would be within the details screen of the email table, at that second level, that’s attached to the table. So ultimately, you want to navigate to an existing detail screen instead of navigating to a new screen.

It’s hard for me to explain this generically without understand your full app flow, but I hope it makes sense what I’m saying. If you understand the general rules of how glide works, then it’s easier to understand how to structure you app to make it work the way you want.

I’ve played with this option on this dummy app.
I was actually trying there something which you just confirmed isn’t the right way of doing it - using the “go to tab” action. My logic was to have a tab for this email form and that tab would be hidden from the users. The go-to does work fine, but for some reason the “go back” action doesn’t do anything. Do you know way? What I also tried doing, as you’ll see in the dummy, is to add a USC with the “last screen visited”, so I can somewhat manually know where to send the user back to, once finished with the email form (it’s not an email form in the dummy, but same idea).
I’ll try you “show details” concept in a little bit, but I’m sure it’ll work, as did all of your previous advices :slight_smile:

If it’s OK, I’d like to take the question one step further:
Assuming we have a standalone table just for this email form, how would you send back the values to the “originating” table? The goal is to ultimately build a JSON to send to Integromat, as per the wonderful advise from @Darren_Murphy .
I was thinking to add to the template column (that build the JSON) a variable such as EMAILFORM. The variable will actually be structured as a part of a JSON. If the user went to the email form, this variable will push the email details to the JSON being sent to Integromat. If user hasn’t went, the variable will return blank. I’m not sure if the JSON being sent to Integromat will be negatively effected by this blank, but I don’t believe it would.
Can you think of a better idea? or tell me why this idea might fail?

Go Back just takes you back one screen on the current tab. If you’re already at the top-level screen, then it won’t do anything. Sounds like you need another Go To Tab to get back to where you were.

If your standalone table has just a single row (or the data you need is on the first row), then you can just use a Single Value column. Otherwise, you may need a single relation.

PS. “advise” is something you do, and “advice” is something you give (or receive) :stuck_out_tongue:

Indeed, single row USC, as all custom forms.

“Use” as in singular, to catch all columns in this email form?
Or plural, i,e, one SV column for each required column from the email form?
Do you see a problem with the method I suggested: building a partial JSON to be joined to the “bigger” JSON being sent to Integromat from the originating form?

I think I misunderstood. My answer was assuming that you just had a single column value that you wanted to transport to another table. Anyway, yes - if it’s just a single row then you could use a series of single value columns.

Without actually seeing your app, nope.

Hi Jeff, would you mind explaining in more detail how to set up the “Add row” action so that the user specific column values are written in the final placeholder table? I´ve not been able to do so.
Many thanks!

Should be pretty simple. Just choose ‘Add Row’ as the action, and select your destination table. The columns in that destination table will show up on the left side of the configuration. Choose the user specific columns from the dropdowns on the right side of the configuration.

image

Tahnks for your quick response!
I´m sorry, I see that for glide tables it works, but i fail to mention that I was trying to transfer the data from a Glide table (temporary placeholder) to a Google sheet table I also have in the Glide data editor (permanent placeholder). And in that case I did not see how to make it work.
Is there a way?

Shouldn’t make a difference. A table is a table in this case, regardless of the source of that table.

1 Like

Yes, I got to do it now. I was doing something wrong clearly! Many thanks!

1 Like