HTMLGuyLLC/jConfirm

DOM elements loaded by ajax not clickable

Closed this issue · 3 comments

Hi,
If HTML is loaded with .load() by ajax, elements within this "new" loaded HTML will not be seen by the library and hence the confirm popup will not show.

This is most likely due to:
https://stackoverflow.com/questions/1359018/how-do-i-attach-events-to-dynamic-html-elements-with-jquery

A solution is to add the:
$(function(){
$('[data-toggle="confirm"]').jConfirm({
...
inside the new loaded HTML.

Dynamically added HTML will work with this:

$('body').on('click', '[data-toggle="confirm"]', function(){
     $(this).jConfirm({
         show_now: true
     });
});

FYI, this is a pretty basic thing that you'll need to understand about JS. Almost every plugin will require you to re-attach to newly added content because if you don't...it's resource intensive to scan for changes or attach events to the parent (my example above attaches to the body which is not ideal but works).

Thanks. I was aware of your solution, but not exactly in your elegant way: $(this).jConfirm...
Thank you for your great plugin and time.