custom widget model does not change

[naive hull]

Hello, I have followed the tutorials (text and video) from appsmith regarding the custom widget data model. My problem persists in multiple new apps I created more exactly the platform > widget data model updates do not get propagated.

Other bindings with other elements are working.

I tried with appsmith-ce 1.40, 1.45, 1.47, 1.48
I tried Chrome and safari
I tried with bindings query, text and select inputs.
I have no extra installed library.

the simplest example is

default model

{
  "select": "{{Select1.selectedOptionValue}}",
    "text":"{{Input1.text}}"
}

// Importing necessary React libraries
import React from 'https://cdn.jsdelivr.net/npm/[email protected]/+esm'
import reactDom from 'https://cdn.jsdelivr.net/npm/[email protected]/+esm'


function App() {
    return (<div>
                    <p>select: {appsmith.model.select}</p>
<p>text: {appsmith.model.text}</p>
</div>)
}
console.log("load")

appsmith.onReady(() => {
    console.log("ready")
    const root = document.getElementById('root');

    reactDom.render(<App />, root);

    appsmith.onModelChange = (newModel) => {
        console.log("model changed",newModel)
        reactDom.render(<App />, root);
    }

    appsmith.onUiChange = () => {
        console.log("ui changed", appsmith.model)
        reactDom.render(<App />, root);
    }
});

the methods onModelChange are not called when the inputs data bindings changed, the console logs never gets triggered.
I see the console logs load and ready but not the others.

Since there is no js method to programatically push new data model, and from the widget I cannot access the other components, and the bindings are not working I am stuck.

[sly bay]

Hello, I'm AppsmithBot, here to assist you with your Appsmith queries.

It seems like you're experiencing issues with the onModelChange and onUiChange methods not being triggered in your custom widget. Here are a few things to check and try:

1. Ensure onReady is Properly Set Up: Make sure that your appsmith.onReady function is correctly set up and that the component is initialized within this function. This ensures that the parent application is ready to communicate with your custom component?5:7?source?.

2. Check Model Bindings: Verify that the bindings in your Default Model are correctly set up. The properties should be accessible using appsmith.model.propertyName within your JavaScript code?5:1?source?.

3. Use updateModel for Changes: If you need to update the model from within your custom widget, use the appsmith.updateModel method. This ensures that changes are propagated back to the Appsmith platform?5:1?source?.

4. Debugging: Add console logs within the onModelChange and onUiChange handlers to ensure they are set up correctly and to see if they are being called at any point.

5. Check for Errors: Look for any errors in the browser console that might indicate issues with the widget setup or JavaScript execution.

If these steps do not resolve the issue, it might be beneficial to review the specific setup of your custom widget or consider reaching out for more detailed support. Let me know if you need further assistance!

If you don't find my response helpful, you can request to speak to a human agent.

[naive hull]

1. The onready is set up and working
2. the bindings are working since the defautl values are displayed
3. Like I said i want to update from platform/outside NOT withing the widget
4. I already did that see the code
5. appsmith always throws errors in console

[sly bay]

Given your situation, it seems like the issue might be related to how the Appsmith platform is handling the data model updates for custom widgets. Here are a few additional steps you can take:

1. Check for Console Errors: Since you mentioned that Appsmith always throws errors in the console, it would be helpful to identify what those errors are. They might provide clues about what's going wrong.

2. Verify Widget Configuration: Ensure that your custom widget is correctly configured in the Appsmith editor. Double-check the widget's properties and ensure that the data bindings are correctly set up.

3. Update Appsmith Version: Since you've tried multiple versions, ensure that you are using the latest stable version of Appsmith. Sometimes, bugs are fixed in newer releases.

4. Review Documentation: Double-check the Appsmith documentation for any updates or changes related to custom widgets and data model handling. There might be new methods or best practices introduced.

5. Community and Support: Consider reaching out to the Appsmith community forums or support channels. Other users might have faced similar issues, and there might be community-driven solutions available.

If none of these steps resolve the issue, it might be a deeper problem with the platform's handling of custom widget data models, and you may need to escalate it to Appsmith's technical support for further investigation.

If you don't find my response helpful, you can request to speak to a human agent.

[naive hull]

I request to speak to a human agent , and how can I reach to community? isn't this channel?

[sly bay]

Someone from our team will reach out to you on this thread. In the meantime, you can have a look at our documentation to try & resolve your query https://docs.appsmith.com?utm=bot

[naive hull]

The problem was that I was replacing the onModelChange method instead of calling it appsmith.onModelChange(..)