Joe Fontana
Joe Fontana

Reputation: 141

Elm - Dynamic Html Option tags within a Select tag

Elm newbie here.

When I replace the CustomerSelect element within the below Mpower module with the following one

customers = ["Select Customer","Customer 1","Customer 2","Customer 3"]
customerSelect =
  select [ ]
    [ List.map customerItem customers
    ]

I get an Elm Compiler "Type Mismatch" error:

Function select is expecting the 2nd argument to be:

List VirtualDom.Node

But it is:

List (List Html)

Where does this come from?

module Mpower where

import Html exposing (..)
import List exposing (..)

customerItem custname =
  option [ ] [ text custname ]

customerSelect =
  select [ ]
    [
    customerItem "Select Customer",
    customerItem "Customer 1",
    customerItem "Customer 2",
    customerItem "Customer 3"
    ]

view =
  div []
    [ customerSelect
    ]

main =
  view

Upvotes: 3

Views: 618

Answers (1)

Apanatshka
Apanatshka

Reputation: 5958

List.map already returns a list, but you still have it in the square brackets, so it's wrapped in another list. Wrap it in parentheses instead:

customers = ["Select Customer","Customer 1","Customer 2","Customer 3"]
customerSelect =
  select [ ]
    (List.map customerItem customers)

Upvotes: 5

Related Questions