Select to view content in your preferred language

Calcite Input display character count

234
1
Jump to solution
10-09-2024 11:07 AM
Labels (1)
AudreyWatson
Emerging Contributor

I've looked around and could only information related to the text area component regarding character count. Is there not a way to show character count for normal text input components? 

0 Kudos
1 Solution

Accepted Solutions
Mac_And_Cheese
Occasional Contributor

The character count visual affordance is built into Text Area as the component provides additional UI surface around the input area for display.

While this isn't built-in to Input components, it is simple to determine the character count using events.

In the case of Input Text, you can listen for either the `calciteInputTextInput` or `calciteInputTextChange` event to fire, and use the resultant value to populate your UI as needed:

Calcite Input Text Event Count 

View solution in original post

0 Kudos
1 Reply
Mac_And_Cheese
Occasional Contributor

The character count visual affordance is built into Text Area as the component provides additional UI surface around the input area for display.

While this isn't built-in to Input components, it is simple to determine the character count using events.

In the case of Input Text, you can listen for either the `calciteInputTextInput` or `calciteInputTextChange` event to fire, and use the resultant value to populate your UI as needed:

Calcite Input Text Event Count 

0 Kudos