# Connectiving reactive event to event handler

**URL:** <https://discuss.ocaml.org/t/connectiving-reactive-event-to-event-handler/10233>\
**Category:** Community\
**Tags:** react, js\_of\_ocaml, web\
**Created:** [July 28, 2022, 8:40am UTC](https://discuss.ocaml.org/t/connectiving-reactive-event-to-event-handler/10233 "2022-07-28T08:40:26Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kakadu](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.ocaml.org/kakadu/32/1204_2.png) [@Kakadu](https://discuss.ocaml.org/u/Kakadu)\
**Post date:** [July 28, 2022, 8:40am UTC](https://discuss.ocaml.org/t/connectiving-reactive-event-to-event-handler/10233/1 "2022-07-28T08:40:26Z")

</div>

I found a piece of code for dynamic creation of HTML5 elements and adding a reactive contents to it.

```ocaml
let open Js_of_ocaml_tyxml.Tyxml_js in
let input_area =
  To_dom.of_textarea
  @@ R.Html5.(
       textarea ~a:[a_id (Xml.W.return "input_area")]
       @@ React.S.map
            (fun n ->
              let n = n mod List.length examples in
              log "Got a signal with index %d" n;
              let _, spec = List.nth examples n in
              txt (Xml.W.return spec))
            (fst reactive_stuff123))

```

Also I know a piece of code to add a handler to already existing element using pure Js\_of\_ocaml:

```ocaml
let combo =
    Dom_html.getElementById_coerce "demos" Dom_html.CoerceTo.select
    |> Option.get
in
combo##.onchange := Dom_html.handler (fun _ -> (* stuff *) Js._true);

```

**Question** : How could I use a reactive value as contents of already created HTML element? In other words, how should I combine reactive stuff with `Dom_html.handler`s?

P.S. My reactive textarea looks verbose, and it doesn’t react on reactive events 🙂 when I manually change the contents of text area, but it’s probably a topic for another question.

---

<div class="post-metadata">

**Author:** ![olleharstedt](https://avatars.discourse-cdn.com/v4/letter/o/f1d935/32.png) [@olleharstedt](https://discuss.ocaml.org/u/olleharstedt)\
**Post date:** [July 28, 2022, 3:35pm UTC](https://discuss.ocaml.org/t/connectiving-reactive-event-to-event-handler/10233/2 "2022-07-28T15:35:08Z")

</div>

May I ask which lib you are using?

---

<div class="post-metadata">

**Author:** ![Kakadu](https://sea2.discourse-cdn.com/flex020/user_avatar/discuss.ocaml.org/kakadu/32/1204_2.png) [@Kakadu](https://discuss.ocaml.org/u/Kakadu)\
**Post date:** [July 28, 2022, 6:24pm UTC](https://discuss.ocaml.org/t/connectiving-reactive-event-to-event-handler/10233/3 "2022-07-28T18:24:44Z")

</div>

I use js\_of\_ocaml-tyxml which depends on [React / Erratique](https://erratique.ch/software/react)