ELM : Onlick button to port the particular string in HTML message to JS when i click the button

Question

I have model

   type alias Model =
    { 
      url : String
    , devices : List Device
    , input : String
    , isFilter : Bool
    , deviceSuggestion : Maybe Device
    }

type alias Device =
    { 
      status : String
    , license_plate : String
    , device_id : String
    }

and below is my render view and i want to get the device_id and port to JS

renderPost : Device -> Html Msg
renderPost devices =
div []
    [
       [ text "Device_id : " 
        , button [ onClick PortDeviceID ] [ text (Debug.toString devices.device_id) ]
        , pre [] [ text "device_model : " , text (Debug.toString devices.device_model) ]  
        , pre [] [ text "license_plate : " , text (Debug.toString devices.license_plate) ]

     ]

renderPosts : Model -> Html Msg
renderPosts model =
([ text "Device List" ] ++ List.map (\device -> renderPost device) model.devices)

and my updates is here. I have no idea how to get the text because the devices.device_id is from json file

    PortDeviceID ->
         ( { model | deviceID = "" }, //port device_id --> not working)
    GotResult result ->
        case result of
            Ok devices ->
                ( { model | devices = devices }, portDevice devices ) // this give full list

I want to do like , when i click the button then i can port the specific device_id to JS. The thing is it is in Device -> Html Msg format , so im stuck lol. Any ideas to do it? Any help is appreciate !

Answer 1

Case solved here, in View , i do like below, instantiate the devices.device_id

renderPost : Device -> Html Msg
renderPost devices =
div []
    [
       [ text "Device_id : " 
        , button [ onClick (PortDeviceID devices.device_id)] [ text (Debug.toString devices.device_id) ]

Then in updates , same let the portDeviceID String

 PortDeviceID deviceID->
         ( { model | deviceID = "" }, portDeviceID deviceID )

Anyway thanks for help Jack Leow