I have added onClick events to several text boxes via code. The text boxes themselves each have unique text that comes from an API call, and different information is displayed depending on which text box is clicked. The click events work for all except one specific text box - txtSaddleRock1 .
Perhaps it is due to the fact that I originally created the onClick event via the Web UI (see screenshot), which I have since deleted, and now I am adding the onClick event via code .
Whatever the case, I have tried deleting this text box entirely several times, and recreating (with the same name) to no avail. For some reason, the onClick event will not attach to this text box element. But I know the text element is available on the page because I can change the text when I reference its id.
Here is a snippet of my code. Any help you can provide is much appreciated.
$w . onReady ( function () {
// Write your JavaScript here
// To select an element by ID use: $w(‘#elementID’)
// add click event to each text box
var clickableTextBoxes =
"#txtSaddleRock1, #txtSaddleRock2, #txtSaddleRock3, #txtSaddleRock4, #txtSaddleRock5, " +
"#txtClubhouse1, #txtClubhouse2, #txtClubhouse3, #txtClubhouse4, #txtClubhouse5, " +
"#txtSaratogaSprings1, #txtSaratogaSprings2, #txtSaratogaSprings3, #txtSaratogaSprings4" ;
$w ( `# ${ clickableTextBoxes }`). onClick ( clickAction );
}
//outside of onReady function
const clickAction = function populateTemplate ( event ) {
//ID of clicked textbox
//event.target = $w(‘#saddlerock1’)
var elementId = ( event . target ). text ;
//do other stuff...
}