#Tutorial | How to dynamically set character limit

Tips
1

I saw on the forum some people trying to define the character limit of an input dynamically, and actually, that’s very simple, even if Bubble doesn’t provide this function natively for some reason.

  1. Define the ID of your input:

image

:information_source: If setting an ID isn’t available, go to Settings > General > Expose the option to add an ID attribute to HTML elements (bottom of the page).

  1. Drag an HTML element onto the page and put this code inside it:
<script>
var inputElement = document.getElementById("INPUTID");

var maxLength = 0;

inputElement.maxLength = maxLength;
</script>

In var maxLength, you should define the number of characters you want to limit; this value can be dynamic, like this:

image

You don’t necessarily have to do this with the HTML element; alternatively, you can try using the Toolbox plugin and, through the workflow, run a Javascript (just paste the same code above without the tags).

The result should be something like this: :blush:

2024-04-18 19-34-42

6 Likes