In my code I have a popup with a custom element in it for uploading files. However, whenever you open the popup up for the first time it gives a "$w(...).on is not a function" error and none of the other non-custom buttons on the popup work. BUT if you close the popup and open it a second time without refreshing the page or anything, then it works just fine. I have no idea what could cause this other than the site trying to register the event before the element is loaded. If that is the problem then I have no idea how to fix that. What should I do?
let curRow = -1; let curData = {}; let hidden = true; let uploaded = false; let csvArr;
$w('#customElement1').on('my-event', (event) => { console.log('The event triggered successfully.'); console.log(event.detail.name) let rows = $w("#table1").rows; csvArr = event.detail.name.split("\n"); uploaded = true; $w("#button14").enable(); for (let j=1;j<csvArr.length;j++) { let userArr = csvArr[j].split(","); let email = userArr[1]; let fullName = userArr[0]; let phonenumber = userArr[2]; rows.push({name: fullName, Email: email, phoneNum: phonenumber}); } $w("#button14").enable(); $w("#button12").disable(); $w("#button13").disable(); curRow = -1; $w("#table1").rows = rows; $w("#input1").value=""; $w("#input2").value=""; $w("#input3").value=""; $w("#input4").value=""; });
If the customElement1 element exists on your page, this error means you set the $w('#customElement1').on from outside the $w.onReady. So move it to the block of the $w.onReady.