Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Adam Beer
Adam Beer
11,314 Points
Posted by Adam Beer
Adam Beer
11,314 Points

React, Redux, Redux-form with immutableJS

Hi everybody!

I need some help. I built a CRUD app with react-redux and ImmutableJS. It's working fine but I would use dynamic select elements and the problem started here. Because when I rewrote my code and added the new road details, I got error message or the value is undefined. (honnan - From, hova - Where, mivel - what kind of car)

I tried this:

<select>
  {this.props.cars.map((data) => {
    <option value={data}>{data}</option>
  })}
</select>

but this is undefined.

I put map() outside the <select> tag, then worked, but I got a new select tag, so I had 2 <select> tag with 1-1 car.

I'm new in the redux and immutableJS, but I used immutableJS because I found a great redux-form which working with the immutableJS. So it's working fine but I would use the <select> tag with dynamc data. I would appreciate it if you could help to me. Thank you very much!

This is my whole project -> https://github.com/trAApex/todoapp/

In the NewRoad.js file I would like to use the <select> tag with dynamic data -> https://github.com/trAApex/todoapp/blob/master/src/components/NewRoad/NewRoad.js

1 Answer

Lukas Dahlberg
Lukas Dahlberg
53,736 Points
Lukas Dahlberg
Lukas Dahlberg
53,736 Points

What's undefined? The select options?

If so, my guess would be that you used curly brackets in your map but didn't explicitly return the option.

If you want an implicit return, you omit the brackets 

{this.props.cars.map((data) =>
    <option value={data}>{data}</option>
)}

Otherwise:

{this.props.cars.map((data) => {
     return <option value={data}>{data}</option>
})}