Preloading options for select with reactJS in Rails

Question

I'm trying to do a select by dynamically loading options using React.

my form component:

...
React.DOM.select
  className: 'form-control'
  name: 'user'
  React.createElement UserOptions

user options component:

@UserOptions = React.createClass
  getInitialState: ->
    connections: []

  componentDidMount: ->
    @getUsers()

  render: ->
    for connection in @state.connections  
      React.DOM.option
        value: connection.id
        label: connection.name

  getUsers: ->
    $.ajax 
      type: 'GET'
      url: '/connections'
      dataType: 'json'
      success: (connections) =>
        @setState(connections: connections)

When I try the page, javascript breaks (not loading anything) with an error

Uncaught Invariant Violation: Constructor.render(): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.

When trying to do the loading in componentWillMount callback, I get the same error +

Uncaught TypeError: Cannot read property '_currentElement' of null

I'm using react-rails gem.

weird thing is that when I debug inside success calllback, call the setState manually and then check the connections they are updated, but I get the Uncaught TypeError: Cannot read property '_currentElement' of null anyways

Any help will be appreciated. I'm new to React so maybe it's something trivial.

Preloading options for select with reactJS in Rails

0 Answers0