# Word Counter in Text Box

**URL:** <https://forum.wixstudio.com/t/word-counter-in-text-box/38877>\
**Category:** Ask the community\
**Tags:** question, code\
**Created:** [April 18, 2018, 1:25am UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877 "2018-04-18T01:25:15Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![beauvaisdesigns](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/beauvaisdesigns/32/7340_2.png) [@beauvaisdesigns](https://forum.wixstudio.com/u/beauvaisdesigns)\
**Post date:** [April 18, 2018, 1:25am UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/1 "2018-04-18T01:25:15Z")

</div>

How do I put a Word Counter in a Text Box user input element. I have the text box set up and connected to database. I just need a Word Counter in the box so people can see how many words they are typing in the box.

---

<div class="post-metadata">

**Author:** ![yisrael-wix](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/yisrael-wix/32/1107_2.png) [@yisrael-wix](https://forum.wixstudio.com/u/yisrael-wix)\
**Post date:** [April 18, 2018, 4:37am UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/2 "2018-04-18T04:37:38Z")

</div>

Hi,

Welcome to the Wix Code forums.

You can check the word count by using the **onKeyPress()** event handler:

```javascript
export function input1_keyPress(event, $w) {
    setTimeout(() => {
        let val = event.target.value;
        if(val.length === 0)
            return;
        let count = WordCount(val);
        $w("#count").text = "" + count;
    }, 10);
}

function WordCount(str) { 
    return str.split(" ").length;
}

```

WordCount() is a simple function that splits the string up into words and returns the word count. The above example calls this function for each keypress and displays the count in the $w(“#count”) text field.

Eazy Peazy,

Yisrael

---

<div class="post-metadata">

**Author:** ![beauvaisdesigns](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/beauvaisdesigns/32/7340_2.png) [@beauvaisdesigns](https://forum.wixstudio.com/u/beauvaisdesigns)\
**Post date:** [April 18, 2018, 4:51am UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/3 "2018-04-18T04:51:34Z")

</div>

Thank you! I am new to code… do I copy and paste that code into the editor code area? Does the word counter then appear for the person filling out the form to see? I really appreciate the help!!!

---

<div class="post-metadata">

**Author:** ![yisrael-wix](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/yisrael-wix/32/1107_2.png) [@yisrael-wix](https://forum.wixstudio.com/u/yisrael-wix)\
**Post date:** [April 18, 2018, 5:03am UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/4 "2018-04-18T05:03:31Z")

</div>

You need to connect the keypress handler to the input component:

 ![](https://us1.discourse-cdn.com/wix/original/3X/1/8/18bc5a3399e3fb9ddc99e4c977ec9a57671a9bd8.png)  
When you enter the name of the event handler into the properties panel, a function with that name will be created and displayed in the code panel. You can then copy the code from my input1\_keypress() function into the newly created event handler. Also, copy the WordCount() function into the code page as well.

I would highly recommend reading about [Wix Code basics](https://support.wix.com/en/wix-code/wix-code-basics) in order to familiarize yourself with Wix Code.

Good luck and have fun,

Yisrael

---

<div class="post-metadata">

**Author:** ![beauvaisdesigns](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/beauvaisdesigns/32/7340_2.png) [@beauvaisdesigns](https://forum.wixstudio.com/u/beauvaisdesigns)\
**Post date:** [April 18, 2018, 5:05am UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/5 "2018-04-18T05:05:38Z")

</div>

Thank you!

---

<div class="post-metadata">

**Author:** ![jeff-haskins](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/jeff-haskins/32/1864_2.png) [@jeff-haskins](https://forum.wixstudio.com/u/jeff-haskins)\
**Post date:** [February 11, 2019, 5:53pm UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/6 "2019-02-11T17:53:01Z")

</div>

How would convert that to an input rather than just text so can be part of input to database?

---

<div class="post-metadata">

**Author:** ![jeff-haskins](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/jeff-haskins/32/1864_2.png) [@jeff-haskins](https://forum.wixstudio.com/u/jeff-haskins)\
**Post date:** [February 11, 2019, 5:53pm UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/7 "2019-02-11T17:53:03Z")

</div>

How would convert that to an input rather than just text so can be part of input to database?

---

<div class="post-metadata">

**Author:** ![ericheuser](https://avatars.discourse-cdn.com/v4/letter/e/c6cbf5/32.png) [@ericheuser](https://forum.wixstudio.com/u/ericheuser)\
**Post date:** [June 25, 2021, 3:43pm UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/8 "2021-06-25T15:43:19Z")

</div>

The code works to display on the page but I don’t seem to be able to save the word count to a dataset field.

---

<div class="post-metadata">

**Author:** ![yisrael-wix](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/yisrael-wix/32/1107_2.png) [@yisrael-wix](https://forum.wixstudio.com/u/yisrael-wix)\
**Post date:** [June 27, 2021, 8:05am UTC](https://forum.wixstudio.com/t/word-counter-in-text-box/38877/9 "2021-06-27T08:05:41Z")

</div>

Please add your own issue into a new post instead of bumping up an old post. Explain what you are trying to do, what works, and what doesn’t. Also, add any code in a code block as stated in the [Forum Guidelines](https://www.wix.com/corvid/forum/community-discussion/forum-policies-and-guidelines) .

This is an old post and is being closed.