So I have the following code that I am using to create a form that when you click into a field it makes sure the most current data from the database is in the field and then when you leave the form field it saves the text area back to the database. There's a lot of other fields already in the form in the display() function that work. However this is the first database field I am working with that is a list(string) so I'm trying to figure out how to handle those. When I run this the html all looks correct and I can even see the events for the fields. However the fields generated with display_lp don't fire the onclick or onblur events. Is there a reason why?
display_lp(path) = (
List.mapi(
x, characterlp -> textid = "#edit_content_lp_{x}"
divid = "#show_content_lp_{x}"
<div class="show_content" id={divid} onclick={_ -> edit_lp(path, x) }>
{x+1}:
<textarea class="edit_content" id={textid} cols="20" rows="1" onblur开发者_运维知识库={_ -> save_lp(path,x) } >
{characterlp}
</textarea>
</div>
, /characters[path]/lifepaths)
)
display(path) = (
Resource.styled_page("{path}'s character sheet",["/resources/css.css"],
/* a bunch of other irrelevant html *?
<div class="show_content" id=#show_content_lp> Lifepaths: { display_lp(path) }
</div>
<a href="..">Back to Directory</a>
)
)
I have tested with a code similar to yours, and it seems that the onclick, onblur are not triggered because your IDs are incorrect, you must remove the #
characters like this :
textid = "edit_content_lp_{x}"
divid = "show_content_lp_{x}"
However, if you want to use #
, you should do :
my_id_var = "some_text_{nb}"
<div id=#{my_id_var}>...</div>
Do you notice the difference?
This is a minimal code showing how to use onclick, onblur on a textarea.
do_click(_event) =
jlog("CLICK: {Dom.get_value(#tt)}")
do_blur(_event) =
jlog("BLUR: {Dom.get_value(#tt)}"
main() =
<textarea id=#tt
onclick={do_click}
onblur={do_blur)}>Hello</textarea>
server = Server.one_page_bundle("OpaTest", [], [], main)
N.B : there is no problem putting the onclick on the div, but i wanted to keep it simple
精彩评论