# Clear input with X

**URL:** <https://community.thunkable.com/t/clear-input-with-x/1664088>\
**Category:** Questions about Thunkable X\
**Tags:** list, textinput\
**Created:** [January 2, 2022, 1:53pm UTC](https://community.thunkable.com/t/clear-input-with-x/1664088 "2022-01-02T13:53:03Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![overshield](https://avatars.discourse-cdn.com/v4/letter/o/e19b73/32.png) [@overshield](https://community.thunkable.com/u/overshield)\
**Post date:** [January 2, 2022, 1:53pm UTC](https://community.thunkable.com/t/clear-input-with-x/1664088/1 "2022-01-02T13:53:03Z")

</div>

Does this exist where you can instantly clear the text with a little x on the end of the text input?

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/a/7/a79e2847820f3c365d387e31b813882c96a7bfed.png)

---

<div class="post-metadata">

**Author:** ![towball](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/towball/32/68409_2.png) [@towball](https://community.thunkable.com/u/towball)\
**Post date:** [January 7, 2022, 9:10pm UTC](https://community.thunkable.com/t/clear-input-with-x/1664088/2 "2022-01-07T21:10:12Z")

</div>

@overshield

In the thunkable public gallery  
Type towball  
 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/b/b/bb2325f661a35771a1da00b1b2a4825f2891e08e.png)  
 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/c/3/c3d195f964fad7b25e2bfa2371077477e406efa3.png)

Select X to Clear public project

Here is a very simple solution to clearing the text.

![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/1/a/1abcf2d4cb956574ed239955ff932d41ad74f700.png)

Get the X from google or make the X image that you want  
Add a row  
Add a text input to the row  
Add an image to the row

In the blocks put the following

![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/f/5fbeaca0279131f21a0c0de99d44003ce4cf4a2e.png)

Regards Baz

---

<div class="post-metadata">

**Author:** ![overshield](https://avatars.discourse-cdn.com/v4/letter/o/e19b73/32.png) [@overshield](https://community.thunkable.com/u/overshield)\
**Post date:** [January 7, 2022, 10:08pm UTC](https://community.thunkable.com/t/clear-input-with-x/1664088/3 "2022-01-07T22:08:59Z")

</div>

I ended up building my own and solving it with this

It’s 2 inputs both height absolute 35 with edges rounded to around 20 or more  
I customized the connecting edges to not be rounded so they appear to be a single input.  
This is under Advanced \> Styling

Then I make the 2nd input width fit text and add 15 padding to the right side.

I put both of those inputs into a SINGLE row, and that row is in a column, then I just hide the column.

Then in the blocks I clone the row (the row is set to visible so I don’t have to unhide it)  
Then I count every input on screen and find that specific component that I just tapped.  
Then it just counts every input on the screen, minus 1 (because it must be the PRIOR INPUT since they’re literally right next to each other).  
Then it clears the text of that PRIOR INPUT.  
And it dismisses the keyboard anytime you tap an input with that specific hint set, in my case I use the emoji ✖

Blocks, layout, and on screen results are in the SS below

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/2/7/27d606be9d9eb2f2f392d5bc5672c679ba2642a0.png)  
 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/c/3/c36fb4b0e86aac6f9d976b06a69e338cccd1a7fa.png)

---

<div class="post-metadata">

**Author:** ![towball](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/towball/32/68409_2.png) [@towball](https://community.thunkable.com/u/towball)\
**Post date:** [January 7, 2022, 10:28pm UTC](https://community.thunkable.com/t/clear-input-with-x/1664088/4 "2022-01-07T22:28:30Z")

</div>

**Mark Solved**

---

<div class="post-metadata">

**Author:** ![overshield](https://avatars.discourse-cdn.com/v4/letter/o/e19b73/32.png) [@overshield](https://community.thunkable.com/u/overshield)\
**Post date:** [February 6, 2022, 10:32pm UTC](https://community.thunkable.com/t/clear-input-with-x/1664088/5 "2022-02-06T22:32:56Z")

</div>

I have an even better solution…

It’s right below the hint text color under the advanced settings of Text Input components  
Updated this as the real solution

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/8/0/80f47c369860b812a138044495bc9e195dceb75b.png)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/f/0f59f292712368bce16ff80133ae10de8a6f27e8.png) [@system](https://community.thunkable.com/u/system)\
**Post date:** [May 7, 2022, 10:32pm UTC](https://community.thunkable.com/t/clear-input-with-x/1664088/6 "2022-05-07T22:32:57Z")

</div>

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.
