# Custom CSS for Notes component

**URL:** <https://community.glideapps.com/t/custom-css-for-notes-component/68753>\
**Category:** Ask for Help\
**Tags:** custom-css\
**Created:** [December 15, 2023, 11:36pm UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753 "2023-12-15T23:36:38Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 15, 2023, 11:36pm UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/1 "2023-12-15T23:36:38Z")

</div>

Hi, community!  
I hope you are fine!  
I find useful trick to control input data format without any computed columns and JS  
If i need number entry so i have Number entry component, but recently users try to copy form web site and past to this number component ant it can’t recognize if 200$ just 200  
In this case i can use Notes component to point to numeric basic column and it works well, it recognizes 200$ as numeric 200.  
But Notes component looks too fat for simple numeric entry.  
May be, someone already know custom css to apply style of Number entry component to Notes component?

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/b/8/b884ac72a114907cb9fa7a6ec4a3ebd2f454db35.png)  
Thanks for advice!  
Alexey!

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [December 16, 2023, 1:10am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/2 "2023-12-16T01:10:41Z")

</div>

Wouldn’t a Text Entry component work the same way that the notes component is?

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 7:35am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/3 "2023-12-16T07:35:06Z")

</div>

Ah,oh 🙃 😅 🤣  
Yes, of course! Thanks Jeff!!!

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 7:40am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/4 "2023-12-16T07:40:50Z")

</div>

And maybe you known some way to combine features of Numeric entry component and Text entry component without additional step with set column which will no costs update?

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [December 16, 2023, 7:41am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/5 "2023-12-16T07:41:28Z")

</div>

yes… is easy… HTML

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 7:43am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/6 "2023-12-16T07:43:36Z")

</div>

Ou! Santa Uzo! Hi!  
Again, you give to me New Year’s gifts!  
Could you explain little bit more!  
Thanks!

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [December 16, 2023, 7:44am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/7 "2023-12-16T07:44:07Z")

</div>

Explain what exactly you need. I’m a little lost with your explanation…

Do you want to be able to write $ character in a numeric entry… and reject all other characters?  
or extract numbers from the entered characters?

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 7:47am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/8 "2023-12-16T07:47:14Z")

</div>

I need to user entering price which is numeric.  
But usually, they have a copy and paste the text like 200$ from another web site. So, i need to converts this text to numeric entry. Basically, without negative values.  
Also, i don’t want to spend more than one update per form filling

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [December 16, 2023, 7:48am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/9 "2023-12-16T07:48:34Z")

</div>

so if someone writes hjhjdbhjbfe500$$$hdfkdfkdf  
you wanna get 500 ?

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 7:49am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/10 "2023-12-16T07:49:15Z")

</div>

Yes exactly. Also if -500$ must 500

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [December 16, 2023, 7:50am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/11 "2023-12-16T07:50:45Z")

</div>

what is some one writes jjfhfhf-500$$djbjdb30$$$$  
then we have 2 numbers, what you wanna do in that case?

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 7:57am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/12 "2023-12-16T07:57:16Z")

</div>

Usually, they do not to do like this.  
Because staff usually do copying from only four sites and commonly is 4000р. or 4000руб or 4000 руб and never like “4000руб 2000руб”

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [December 16, 2023, 7:59am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/13 "2023-12-16T07:59:10Z")

</div>

ok this will give the first number…

have a text entry value as a p1 in the JavaScript column:

```auto
if(p1){
const match = p1.match(/\d+/); 
return match ? parseInt(match[0], 10) : null;
}
return

```

 ![Screenshot 2023-12-16 at 3.01.12 AM](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/c/0cdc6bb5d45f7624b3a212320d6a82a1a5269e13.jpeg)

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 8:07am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/14 "2023-12-16T08:07:35Z")

</div>

Yes, thanks, of course!  
Computation column, yes i had try to reduce the qty of calc columns.  
Also, rollup column can’t sum text and i must to do additional math to multiply by one. It is not so big problem because, usually i mult. by goods qty

Thanks, thanks!

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [December 16, 2023, 8:08am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/15 "2023-12-16T08:08:50Z")

</div>

But wait… I will give you a better code… this one is not that great

---

<div class="post-metadata">

**Author:** ![Uzo](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/uzo/32/22639_2.png) [@Uzo](https://community.glideapps.com/u/Uzo)\
**Post date:** [December 16, 2023, 8:26am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/16 "2023-12-16T08:26:43Z")

</div>

```auto
if(p1 || p1==0){
var regex = /[^0-9,.]/g;
return p1.toString().replace(regex, '')
}
return

```

I think this one will cover all problems

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 8:42am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/17 "2023-12-16T08:42:14Z")

</div>

Thanks!  
Yes, we can imagine many different tricks just to filter input data but, so beautiful Glide and we must to do many coding just for simple and common things.  
Another computed column must to add thousands space. Because math and basic column can show like 1 000.  
Instead, math i need to show the value in a common Glide table component so, so many computed columns just to simple filter and to show data.  
Thanks, Uzo!  
May be next year will be “beauty” and Glide give as native tools to filtering input data.  
p.s.  
May be ABS of basic column “number” combined with text input is enough  
Thanks, for all for brain storming!

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 16, 2023, 12:36pm UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/18 "2023-12-16T12:36:38Z")

</div>

> [@Jeff\_Hager](#):
>
> Wouldn’t a Text Entry component work the same way that the notes component is?

I completely forgot why I wanted to use Notes specifically: I thought it would save updates when using input on custom form on new screen. But it seems that the text input component now does not take into account the input of each character, but only one, when exiting the editing area. It pleases, it changes everything a lot!

---

<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:** [December 17, 2023, 12:51am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/19 "2023-12-17T00:51:21Z")

</div>

> [@slscustom.ru](#):
>
> Because staff usually do copying from only four sites and commonly is 4000р. or 4000руб or 4000 руб and never like “4000руб 2000руб”

I think if they paste “4000руб” to a number entry component, it renders as 4000 anyway.

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [December 17, 2023, 11:05am UTC](https://community.glideapps.com/t/custom-css-for-notes-component/68753/20 "2023-12-17T11:05:53Z")

</div>

> [@ThinhDinh](#):
>
> I think if they paste “4000руб” to a number entry component, it renders as 4000 anyway.

Hi, ThinhDinh!  
They already tried and no luck

[Next page](https://community.glideapps.com/t/custom-css-for-notes-component/68753.md?page=2)