View multiple text areas, how to determine which changes have been changed?

Question

I am making a simple page with several textareaelements in Elm. I'm struggling to save the data and especially determine which one textareawas updated. Perhaps the example illustrates the point better.

I have several items made in a list view

type alias Model = { List Comment, ... }

type alias Comment = {id: Int, content: String, draftContent: String, ...}

type Event = Save Comment | SaveDraft String

-- view
model.comments
|> List.map(     --iterate the list of comments and render html 
div [attrubute "name" "comment"] [
  textarea [onInput SaveDraft] [text comment.content],
  button [onClick (Save comment)] [text "Post comment"]
]

-- update
case event of
  Save comment ->
    -- Replace the comment content with draft data and clear draft

  SaveDraft draftText ->
     -- Update the draft content with text from event
     -- Which Comment is it?

Based on the examples here , I came up with the idea of ​​sending each textarea input as an event to update a function and save draft data.

Now the problem is that onInputit only accepts types with a parameter String, and I can not determine which of the comments has been changed.

Answer 1

Event, (SaveDraft String → SaveDraft Comment String)

type Event = Save Comment | SaveDraft Comment String

-- view
model.comments
|> List.map(     --iterate the list of comments and render html 
div [attrubute "name" "comment"] [
  textarea [onInput (SaveDraft comment.content)] [text comment.content],
  button [onClick (Save comment)] [text "Post comment"]
]

Currying (SaveDraft comment.content), ,