HI! 

I want to use tags-input widget which attaches some attributes to certain 
element in my body.
The idea is to create normal input field on the elm side and later 
implement additional functionality 
via ports.



So my approach is to load compiled Elm-js code and later once site loads 
append it. I found out that
it returns error if I integrate elm outside "ready" function, which I don't 
really understand why it happens. 

Error:
      TypeError: null is not an object (evaluating 'parent.appendChild')

So the fun comes with logging data...

"0" and "2" return empty jQuery object, even though "body" log already 
includes element with certain id.

"1" returns the correct pointer to an element, I found that it is because 
of js-interloop which puts the tasks 
inside setTimeout function at the end of queue, even with 0 timeout, and 
it's somehow resolved correctly.

But it's not the correct approach, quite obviously! Which approach would be 
correct one and how to achieve
that logs "0" and "2" won't return empty object anymore?


NOTE:
   I use browserify.

JS-Code:

"use strict"

const Elm = require('./elm.js')

const TagsInput = require('./bootstraptagsinput.js')

$(document).ready(function() {

   const App = Elm.Search.fullscreen()

   console.log($("body"));

   console.log("0", $('#tagsInputField'));

   

   setTimeout(() => {
      console.log("1", $('#tagsInputField'));
   }, 0)

   console.log("2", $('#tagsInputField'));

})

Elm-View:
renderSearchBar : Model -> Html Msg
renderSearchBar model =
    input
        [ onInput SearchAggregations
        , placeholder "Search Filters"
        , value model.filterSearch.input
        , id "tagsInputField"
        ]
        []


-- 
You received this message because you are subscribed to the Google Groups "Elm 
Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to elm-discuss+unsubscr...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to