How to re-evaluate TreeSelect options?

[pale zephyr]

I have a modal that allows users to enter new hierarchical records into a table, and they are able to select a parent record from a TreeSelect widget under which to save their new record. Think adding leaves to a hierarchy tree. On save, I want to be able to refresh the TreeSelect so that it updates the hierarchy and they can see their addition. It seems like the options are only evaluated when the whole page is refreshed. I don't see a setOptions method for the TreeSelect. Is this possible?

[restive terrace]

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

To refresh the options in a TreeSelect widget without refreshing the entire page, you can dynamically bind the options to a data source or a JavaScript function. This way, when the data source or function updates, the TreeSelect widget will automatically reflect the changes.

Here's how you can do it:

1. Bind the Options Property: Use a query or a JavaScript function to fetch or generate the options dynamically. For example, if you have a query named fetchData, you can bind its response to the TreeSelect widget's options property like this:

{?{ fetchData.data }?}

2. Transform Data if Needed: If the data is not in the desired format, you can use JavaScript to transform it. For example:

{?{ getdata.data.reduce((acc, cur) => {
const group = acc.find(item => item.value === cur.type);
group ? group.children.push({ label: cur.name, value: cur.name }) : acc.push({ label: cur.type, value: cur.type, children: [{ label: cur.name, value: cur.name }] });
return acc;
}, []) }?}

3. Trigger a Refresh: After saving a new record, you can trigger the query or function to run again, which will update the options in the TreeSelect widget.

By following these steps, you can ensure that the TreeSelect widget updates its options dynamically without needing a full page refresh?5:0?Appsmith Documentation.md?.

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

Hey @pale zephyr,

If you're populating the Tree Select widget from a query you will need to re-run the same query to get the updated data after modifying it. It's recommended to re-run any queries whose results may have changed after performing a modification query such as UPDATE, INSERT, or DELETE. Try this and let us know if you have any further questions.

Thank you for your ongoing support and patience. We aim to provide you with helpful assistance and hope we have addressed your question adequately.

Please take a moment to provide feedback on our service.
https://survey.frontapp.com/v2/09a400bf433bc9676d67/1faa3c19f70c63bbc7006c6b82963b39

[pale zephyr]

The TreeSelect is already calling a function to populate the options, I just need that widget to re-execute that function.

I tried setting the widget options from inside the function but it says to use the setter method, but TreeSelect doesn't have one

Would I have to set up my JS function in my database as a UDF that returns a table and then create a query for it so I can bind it to the widget? Seems like a crazy workaround but I'm completely new to appsmith

[pale zephyr]

@restive terrace any other options based on my last messages?

[restive terrace]

Hey,

Can you show me how your binding data to the select, and how you're updating it currently?

[pale zephyr]

I have a JS function that accepts data from a query and transforms it. You can see the modal with the TreeSelect and the options binding in this:

There's a save button behind that tree dropdown that inserts the record into the table, and that's when I want the TreeSelect to re-run the function in its options

I tried to execute the function in the onClick event of the button, but that doesn't repopulate the TreeSelect options because I think the function returns an array to the onClick

The only way I can currently get that TreeSelect to repopulate is by refreshing the whole app so that widget gets loaded again

[pale zephyr]

I have no idea what I did, but it seems to be working now 😅 I'll reach back out if I can reproduce it, or I figure out why it's working. Thanks!