You can always work it around by attaching the actual event handler to some
STABLE parent of your button (or to the root document if you cannot tell
the possible parent).
Check the https://api.jquery.com/on/ documentation, the "Delegated events"
section.
In your case it could be:
$(document).on("click", "#menu-toggle", function() {
//you can access the actual element with $(this)
});
Replace the $(document) with something else like $("#menu") or something if
you are sure it won't be replaced, altered, added later, etc... by Elm.
Just beware not to leak the handlers, I mean do not add them more than once
or if you have to then remember to always clean them by disposing the
handler once it's not needed.
Regards,
Witold Szczerba
On Sat, Oct 1, 2016 at 3:05 AM, Timothy Williams <[email protected]>
wrote:
> Yes, this seems to be correct. I entered the javascript code manually in
> the browser which made it work. Very interesting.
>
> Em sexta-feira, 30 de setembro de 2016 03:08:10 UTC-4, Duane Johnson
> escreveu:
>>
>> Perhaps Elm is re-rendering the element on which you've attached the
>> event, thus removing the event? I haven't yet used the Html.Keyed
>> <http://package.elm-lang.org/packages/elm-lang/html/1.1.0/Html-Keyed>
>> library, but I understand it can be helpful in cases like this where you
>> want to keep the same DOM element around, since it has state attached to it.
>>
>> On Fri, Sep 30, 2016 at 1:01 AM, Witold Szczerba <[email protected]>
>> wrote:
>>
>>> Maybe your js code acts too early, when there is no element yet in the
>>> DOM?
>>>
>>> 30.09.2016 8:35 AM "Timothy Williams" <[email protected]> napisał(a):
>>>
>>>> I have this elm-html element:
>>>>
>>>> Html.a [href "#menu-toggle", class "btn btn-default", id "menu-toggle" ]
>>>> [ text "Toggle Menu" ]
>>>>
>>>> which is a direct translation from:
>>>>
>>>> <a href="#menu-toggle" class="btn btn-default" id="menu-toggle">Toggle
>>>> Menu</a>
>>>>
>>>> and shows up in the browser as:
>>>>
>>>> <a href="#menu-toggle" class="btn btn-default" id="menu-toggle">Toggle
>>>> Menu</a>
>>>>
>>>>
>>>> But the same javascript that works on the html doesn't work on the elm
>>>> code:
>>>>
>>>> $("#menu-toggle").click(function(e) {
>>>> e.preventDefault();
>>>> $("#wrapper").toggleClass("toggled");
>>>> });
>>>>
>>>> Is plain js/jquery unable to interact with elm elements as it would
>>>> with html elements?
>>>>
>>>> --
>>>> 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 [email protected].
>>>> For more options, visit https://groups.google.com/d/optout.
>>>>
>>> --
>>> 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 [email protected].
>>> For more options, visit https://groups.google.com/d/optout.
>>>
>>
>> --
> 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 [email protected].
> For more options, visit https://groups.google.com/d/optout.
>
--
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 [email protected].
For more options, visit https://groups.google.com/d/optout.
