Hi there.
I’ve created 2 fields where I’d like to show the user the remaining characters they have left.
The first field is a textbox with a limit of 50 characters. The following code works fine.
But the second field, the remaining characters do not display (they never update). This is a rich text field with a character limit of 2750.
The code is exactly the same for the two fields but with the appropriate variables substituted.
Any thoughts as to why the second field is not updating? Thanks in advance for any help.
// Define the event listener function for title
function textBox3_input ( ) {
const remainingLength = $w ( ‘#textBox3’ ). maxLength - $w ( ‘#textBox3’ ). value . length ;
$w ( ‘#text19’ ). text = Only ${ remainingLength } Title characters remaining. ;
}
// Set the initial value of the #text19 element on page load
$w . onReady ( function () {
textBox3_input ();
});
// Add the event listener to the text box
$w ( ‘#textBox3’ ). onInput ( textBox3_input );
// *************
//Define the event listener function for rich text box
function richTextBox1_input ( ) {
const remainingLength = $w ( ‘#richTextBox1’ ). maxLength - $w ( ‘#richTextBox1’ ). value . length ;
$w ( ‘#text20’ ). text = Only ${ remainingLength } characters remaining. ;
}
// Set the initial value of the #text20 element on page load
$w . onReady ( function () {
richTextBox1_input ();
});
// Add the event listener to the rich text box
$w ( ‘#richTextBox1’ ). onInput ( richTextBox1_input );