Блог

Оповещение о сбоях не запускается для элементов, которые я вводю в DOM.

Я использую драгоценный камень sweet alert 2 (https://github.com/nicolasblanco/sweet-alert2-rails ) в моем приложении rails 5, и оно отлично работает, пока я не добавлю элементы с js response. Я понимаю, что мне нужно привязать прослушиватели событий sweet alert, вызывая их после добавления элементов, но я не знаю как.

Где-то драгоценный камень инициализирует sweet alert и привязывает события к моим HTML-элементам с data-confirm атрибутом, превращающим их в data-sweet-alert-confirm . Я думаю, мне придется вызвать эту функцию инициализации после ввода новых элементов.

В файле просмотра:

 <link href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.css" rel="stylesheet" type="text/css">

<script src="https://code.jquery.com/jquery-3.4.1.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.js"></script>

<div id="append_div" style="margin:20px;"></div>

<button id="add_element">Add Element</button>
  

В коде js:

 <script>
    $(document).ready(function(){

        $(document).on('click', '#add_element', function(){                    
            $(document).find('#append_div').append( 
                '<button class="_appended_btn" style="margin:10px;">Open sweet alert</button>' 
            );
        });


        $(document).on('click', '._appended_btn', function(){
            Swal.fire({     
               type: 'success',
               title: 'Your work has been done',
               showConfirmButton: false,
               timer: 1500
            })
        });

    });
</script>