Dynamic character counter. Make sure to update the field ID (can be pulled from inspect element).
TB.render('component_3', function (data) {
// Select the textarea element by its ID
const textarea = document.getElementById('fieldka6jM4MQ75');
if (textarea) {
// Create a container for the character counter
const charCounter = document.createElement('div');
charCounter.id = 'charCounter';
charCounter.style.marginTop = '5px';
charCounter.style.fontSize = '12px';
charCounter.style.color = '#555';
// Set initial counter text
charCounter.textContent = 'Characters entered: 0';
// Append the character counter below the textarea
textarea.parentNode.appendChild(charCounter);
// Update the character counter dynamically as the user types
textarea.addEventListener('input', function () {
const charCount = textarea.value.length;
charCounter.textContent = `Characters entered: ${charCount}`;
});
} else {
console.warn("Textarea with ID 'fieldka6jM4MQ75' not found.");
}
});