API Call to Get List for Dropdown

Tags: #<Tag:0x00007f8b3c0a6f58>

I’m trying to make an API call to a database to grab a list of options for the dropdown menu I have in a Handsontable. I’m currently using Axios to fetch the list and set it in the React state:

componentDidMount() {
		axios.get('/api/options').then(resp => {
			const names = resp.data.map(i => i.name);
			this.setState({
				namesList: names
			});
		});
	}

Then I provided that state variable to the “source” setting in this.tableSettings

this.tableSettings = {
     data: [some data],
     type: 'dropdown',
     source: this.state.namesList
}

When I do this, the Handsontable renders fine, but I cannot open the dropdown menu. The cell gets stuck on it’s initial value and all I can do is press ESC to get out of the cell.

Is it not possible to use a React state variable as the source for a dropdown?

Hey @dldereklee

have you checked are there any issues in the console? Are you able to edit cells after you open the new dropdown cell type?