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

**URL:** https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497
**Category:** Feature Requests
**Created:** [February 11, 2020, 9:44am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497 "2020-02-11T09:44:17Z")
**Posts on this page:** 20
**Page:** 2

<div class="post-metadata">

### Author: ![Rosewebstudio](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rosewebstudio/32/12261_2.png) [@Rosewebstudio](https://community.glideapps.com/u/Rosewebstudio)
#### Post date: [December 30, 2020, 8:06am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/21 "2020-12-30T08:06:38Z")

</div>

Excellent work @ThinhDinh 👏

---

<div class="post-metadata">

### Author: ![Amal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/amal/32/15421_2.png) [@Amal](https://community.glideapps.com/u/Amal)
#### Post date: [December 30, 2020, 11:18am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/22 "2020-12-30T11:18:56Z")

</div>

@Robert_Petitto, I managed to center the title, by doing a trick that I learnt from one of your older videos. I used the empty whitespace character after the title name.

![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/2/c2df5e5d462701f35689b16ca2d605bbf7a3c7e2.png)

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/a/1/a1fbfca7994f71bdab6c4f44ae40a071361309a7.png)

---

<div class="post-metadata">

### Author: ![Amal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/amal/32/15421_2.png) [@Amal](https://community.glideapps.com/u/Amal)
#### Post date: [January 2, 2021, 7:40am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/23 "2021-01-02T07:40:29Z")

</div>

@ThinhDinh Hi, How did you manage to make the image stretch all the way to the top?

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [January 2, 2021, 8:28am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/24 "2021-01-02T08:28:52Z")

</div>

Here’s a working template.

```
<p>
<a style="position: absolute; width:100%; top: -105px; right: 0%; z-index:-2; opacity: 1" target="_blank" rel="noopener"></a>
</p>
<a style="position: absolute; width:100%; top: -105px; right: 0%; z-index:-2; opacity: 1" target="_blank" rel="noopener">
<div style="background: linear-gradient(to top, #282828 25%, #787878 75%); margin: 0%; padding-bottom:400px;"></div>
</a>
<p>
<a style="position: absolute; width: auto; top: -105px; right: 0%; z-index:-1; opacity: 0.5;" target="_blank" rel="noopener">
<img style="object-fit: cover;" height="400" src="{I}">
</a>
</p>
<center>

```

Change the {I} to your image link.

---

<div class="post-metadata">

### Author: ![Amal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/amal/32/15421_2.png) [@Amal](https://community.glideapps.com/u/Amal)
#### Post date: [January 2, 2021, 9:16am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/25 "2021-01-02T09:16:49Z")

</div>

Thanks. Is there a way to use the image component to stretch it to the top, rather than using a image link? i would like to Image to be dynamic every screen.

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [January 2, 2021, 11:21am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/26 "2021-01-02T11:21:26Z")

</div>

Can you specify more about what you want to be dynamic? You can use my code in a template column and change the {I} part for each row’s image, then use it in a rich text component.

---

<div class="post-metadata">

### Author: ![Amal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/amal/32/15421_2.png) [@Amal](https://community.glideapps.com/u/Amal)
#### Post date: [January 2, 2021, 11:21pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/27 "2021-01-02T23:21:42Z")

</div>

ok got that to work, thanks, but why is my image foggy?

Original:  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/4/0410343b20086b53ec7a1dc1c2a82e927593ca49.jpeg)

CSS version:  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/d/1/d1fd62e335670a09ddb62061246c4add0630573d.jpeg)

---

<div class="post-metadata">

### Author: ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)
#### Post date: [January 2, 2021, 11:29pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/28 "2021-01-02T23:29:17Z")

</div>

@Amal Check if `opacity: 1;` if it’s less than 1, it will be like this, kinda foggy

---

<div class="post-metadata">

### Author: ![Amal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/amal/32/15421_2.png) [@Amal](https://community.glideapps.com/u/Amal)
#### Post date: [January 2, 2021, 11:37pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/29 "2021-01-02T23:37:18Z")

</div>

@Lucas_Pires thanks fixed it. On another topic, can you please tell me the size of the a button, so when i design one outside as an image its the right dimensions

---

<div class="post-metadata">

### Author: ![yann](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yann/32/20115_2.png) [@yann](https://community.glideapps.com/u/yann)
#### Post date: [January 20, 2021, 7:46pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/30 "2021-01-20T19:46:53Z")

</div>

Tried that, thanx for the hint!

However, when a user fills in the fields and submits data, a new row is created with this data. But after that this users sees **all fields pre-filled with the last submitted data**. How can I fix that?

I made user-specific columns, which solved the problem for other users, but not for the same one.

UPD: Solved. In the custom action I added “Set columns” with “Clear field” for each user-specific column.  
Looks like a detailed step-by-step guide is needed for this case.

* * *

Besides, how do you make custom CSS? I understand you can write CSS in “Rich text” component, but how can you make them affect other components?

---

<div class="post-metadata">

### Author: ![Siddharth\_Nahar](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/siddharth_nahar/32/12740_2.png) [@Siddharth\_Nahar](https://community.glideapps.com/u/Siddharth_Nahar)
#### Post date: [January 20, 2021, 9:32pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/32 "2021-01-20T21:32:23Z")

</div>

@vijay Check out the answer here for showing a thank you page after submit.

> [@How can I add user entry by "Add a Row" action?](https://community.glideapps.com/t/how-can-i-add-user-entry-by-add-a-row-action/21464/4):
>
> You can perform additional actions on form submit by going to the features tab within the form. If you would rather do it the way you are showing, you are only performing a single add row action. Change it to a New Action which allows for combo actions. [https://docs.glideapps.com/all/reference/actions/custom-actions](https://docs.glideapps.com/all/reference/actions/custom-actions)

---

<div class="post-metadata">

### Author: ![Ramil\_Rahimzada](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/ramil_rahimzada/32/15656_2.png) [@Ramil\_Rahimzada](https://community.glideapps.com/u/Ramil_Rahimzada)
#### Post date: [February 19, 2021, 9:23am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/33 "2021-02-19T09:23:30Z")

</div>

> [@Robert\_Petitto](#):
>
> ```auto
> <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;
> }
> 
> ```

 ![screenshot](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/9/2/92831fd254be1998cc15edcf57003fdaf3532d6d.jpeg)  
I have used below mentioned CSS code which appeared to be link this (scrensoot). Please let me know how I can solve this ussue. How can I make it stable on the bottom of my form and how I can change the name of submit button.  

```
**[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;**
 **}**
```

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [February 19, 2021, 9:26am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/34 "2021-02-19T09:26:11Z")

</div>

I think you can’t change the name of the button. With the latest developments from Glide, I prefer a custom form with an “add row” button instead.

---

<div class="post-metadata">

### Author: ![yinon\_raviv](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yinon_raviv/32/1627_2.png) [@yinon\_raviv](https://community.glideapps.com/u/yinon_raviv)
#### Post date: [February 19, 2021, 9:30am UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/35 "2021-02-19T09:30:13Z")

</div>

How about you do a small session on this to me to explain what it means and how to use?

---

<div class="post-metadata">

### Author: ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)
#### Post date: [February 19, 2021, 12:40pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/36 "2021-02-19T12:40:54Z")

</div>

The visuals in this make it really easy to understand…

[http://nthmaster.com/](http://nthmaster.com/)

---

<div class="post-metadata">

### Author: ![yinon\_raviv](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yinon_raviv/32/1627_2.png) [@yinon\_raviv](https://community.glideapps.com/u/yinon_raviv)
#### Post date: [February 19, 2021, 1:13pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/37 "2021-02-19T13:13:07Z")

</div>

Thanks brother,  
I think I need something even more basic to understand css better and the way it’s structured

---

<div class="post-metadata">

### Author: ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)
#### Post date: [February 19, 2021, 1:16pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/38 "2021-02-19T13:16:02Z")

</div>

yeah, I know what you mean. CSS has always been a bit of a mystery to me, and I never really got any further than the _very_ basics. But I’ve been forcing myself to learn a bit more since I started with Glide.

---

<div class="post-metadata">

### Author: ![yinon\_raviv](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yinon_raviv/32/1627_2.png) [@yinon\_raviv](https://community.glideapps.com/u/yinon_raviv)
#### Post date: [February 19, 2021, 1:36pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/39 "2021-02-19T13:36:35Z")

</div>

I’m also trying but don’t really have time to do a course and in general I’m more of a ad-hoc autodidact kind of person and would love to find a knowledge center that center the info and allow easy understanding of the structure and definitions.  
Yet to find one

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [February 19, 2021, 1:39pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/40 "2021-02-19T13:39:48Z")

</div>

Sorry brother, I have been really busy but when I find time, at least I will try to document it for you.

I don’t really have deep knowledge about CSS. It’s also an ad-hoc thing for me based on client’s requests. Maybe when you get the basics you can take it from there and just trial and error.

---

<div class="post-metadata">

### Author: ![yinon\_raviv](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yinon_raviv/32/1627_2.png) [@yinon\_raviv](https://community.glideapps.com/u/yinon_raviv)
#### Post date: [February 19, 2021, 1:53pm UTC](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497/41 "2021-02-19T13:53:37Z")

</div>

Yep. I guess no way around spending time to learn the basics

[Previous page](https://community.glideapps.com/t/adding-submit-button-to-a-form-instead-of-the-tick-mark-at-the-top/4497.md?page=1)
