Doble initialization on django-bootstrap-modal-forms

Question

I currently using this library on django https://github.com/trco/django-bootstrap-modal-forms

I got this on my js script:

function initializeBSModal(modalId) {
  const Modal = $(modalId);
  Modal.modalForm({
    modalID: '#bs-modal',
    modalContent: '#bs-modal-content',
    modalForm: '#bs-modal-content form',
    formURL: Modal.data('form-url'),
   });
}

Each time it is used it initialized correctly, but if in any instance it is called twice (e.g draw event on table), it initialized a second time, executing twice or more times on requesting GET to the View (only GET not on POST)

Code example:

{% block content %}
    <div id="bs-modal-create" class="" data-form-url="{% url 'create_item' %}">
        CREATE
    </div>
{% endblock %}
{% block scripts %}
    <script>
        initializeBSModal('#bs-modal-create'); 
        initializeBSModal('#bs-modal-create'); -> This causes 2 initialization, 2nd GET
    </script>
{% endblock %}

How may i only initialize not initialized modals??

Answer 1

Fix it with Modal.off('click');

function initializeBSModal(modalId) {
  const Modal = $(modalId);
  Modal.off('click');
  Modal.modalForm({
    modalID: '#bs-modal',
    modalContent: '#bs-modal-content',
    modalForm: '#bs-modal-content form',
    formURL: Modal.data('form-url'),
  });
}