Adding Submit button to a form instead of the tick mark at the top

It will be good to accept form submissions through a Submit button and being able to show a Thank you screen after the form is submitted instead of going to the previous screen with a overlay of Sent shown on the screen. Is this currently possible? If not, would like to request this to be added.

12 Likes

Has this been changed within glide yet?
I’m eagerly awaiting this submit button feature. People fill in a form from top to bottom. It seems natural to click a big submit button underneath all the form fields you just filled. Not search near the top of the form. Also when you are entering the form fields the submit text for iOS or a tick for android (on the top right) actually folds away out of view. You must click done to unhide the submit text in the top right. Then click submit text to submit the form.
It’s too complex.

I have to use graphic images to explain the process. “Like finish filling in the form down here then come back up here to submit your form”…
It’s natural to click a submit button underneath the form you just filled.
The equivalent would be to place a call to action button in some obscure corner of the screen and use explainer text and images to educate people on what to do next. They going to yawn twice and move along to something less brain sapping.
Please please please add this feature.
And if it’s already been added! Then kindly draw me a picture on where I might find this feature :crazy_face:

4 Likes

It got a thumbs up from @david a while back but nothing yet as far as I’m aware. I think the intention is an additional action type.

2 Likes

I managed to do this with CSS…but it was a bit finicky.
Oct-08-2020 16-28-47

7 Likes

Like a Form Submit Action, which I couldn’t find?

1 Like

This is available now with the add row action + navigation.

That’s true @ThinhDinh but I think you can’t capture “new” input from the user. It has to be pre-existing or entered into “dummy columns”? Unless I’m mistaken?

Yes, it’s intended to be used with “dummy columns”, like what we discussed in another thread the other day I guess.

2 Likes

Hey @Robert_Petitto Can you please share the CSS for this, i would really like to move the Submit Button down

1 Like

Not sure if it is easier for you but you can build a “fake form” yourself using multiple user-specific columns and have an add row button at the bottom.

1 Like

This is close:

<pre><span><style>
[data-test="nav-bar"] :nth-child(3) {
position: fixed;
bottom: 8%;
display: block;
}
[data-test="nav-bar"] :nth-child(3) :nth-child(2) {
background-color: blue;
padding: 0 130px;
margin-left: 15px;
border-radius: 7px !important;
}

A bit wonky still—my CSS skills are hacky—couldnt figure out how to recenter the form title:

7 Likes

Thanks for your nth-child trick, I found a way to hide the nav bar and display the image up to the top reliably!

<pre><span><style>
.glide-app-bar {
    backdrop-filter: blur(2px);
    background:transparent;
    -webkit-backdrop-filter: blur(2px);
}
[data-test="glide-app-bar"] :nth-child(1) {
    backdrop-filter: blur(2px);
    background:transparent;
    -webkit-backdrop-filter: blur(2px);
}
#app-root div[opacity='1'] {
  color: transparent; 
}
.jiuuwu svg {
display: none;
}
.gpkkHC svg {
display: none;
}
.gpkkHC {
position: unset;
}
8 Likes

oooh, that’s nice!

2 Likes

Looks great!

2 Likes

The nth-child trick is so great. I’m sure I will use it to make the CSS more reliable. Got tired of having to replace class names every week or so haha. Thanks again.

2 Likes

That looks really nice! Attention grabber :eyes::eyes:

3 Likes

Hi, i tried that, but i have few columns where users need to enter data and it doesn’t work. Also i have so much of validations happening on my current form, its almost impossible to change now :frowning:

2 Likes

Thanks Rob. Is there a way to keep the button at the bottom of the form ?, its currently moving with the viewport of the user.

1 Like

Can you specify what the problem is here?

1 Like

Ooh :star_struck:

2 Likes