I'm having trouble updating my query in a custom widget. I'm using a JavaScript Object to bind the SQL query to the custom widget, and have a slider on the page that activates another JavaScript Objects that runs the query. In the custom widget I globally defined the array coming from the data model, and update my model through the appsmith.onModelChange.
Everything works when I hardcode the data model. However as soon as I use a database query in combination with data polling, it doesn't do anything. Does not even load the initial data correctly (although it does load to a table). In the editor I see it correctly, but doesnt change when I update the database. On deployed version it sometimes works but never dynamically. As if the appsmith.onModelChange doesnt work in combination with the JS Object or quert. I'm not that experienced in JavaScript and appsmith so have no idea where to look.
// Initialize data colors
let spqdcColors = [];
// asynchronic function to load colors and initiate appsmith.onReady
async function loadColors() {
await new Promise((resolve, reject) => {
appsmith.onReady(() => {
for (let i = 0; i < appsmith.model.colors.length; i++) {
spqdcColors[i] = appsmith.model.colors[i].spqdcColors;
}
resolve();
});
});
}
async function widget1() {
// I’m using the spqdcColors array taken from the query here
}
function recalculateLeftPosition() {
// some additional code during eventlistener event
widget1();
}
// Add event listener to window resize event
window.addEventListener('resize', () => {
pageWidth = window.innerWidth; // Recalculate page width
recalculateLeftPosition();
});
// Call loadColors function when the page loads
window.addEventListener('load', async () => {
await loadColors(); // Load colors asynchronously
});