dom - opa : strange behaviour of dom element update

Question

I have a strange behaviour with the code below:

function update(txt, _)
{
    #text = <>{txt}</>
    #data = <>{txt}</>
}

command = <a onclick={update("test1", _)}> change text1 </a> <+>
      <a onclick={update("test2", _)}> change text2 </a>    


content = <textarea style="width:30%;" rows=1 id=#text > filename </textarea>
    <textarea style="width:100%;" rows=30 id=#data > This is a text area </textarea> 



Server.start(
   Server.http,
   [
     {page: function() {command <+> content}, title: "test" }
   ]
)

When I clik on the links "change text1" or "change text2", the text is updated in the two textareas, but as soon as I edit the value of one of these textareas, the update failed when I clik on the links.

Why ?

Answer 1

我认为这是因为一旦您编辑了 textarea，浏览器就会考虑 textarea 的“值”属性，而不是 textarea 内的 HTML 内容。

所以为了工作，你应该：

function update(txt, _)
{
    Dom.set_value(#text, txt)
    Dom.set_value(#data, txt)
}