django-htmx-modal-form icon indicating copy to clipboard operation
django-htmx-modal-form copied to clipboard

Edit Button not firing up the modal

Open cfox4ever opened this issue 2 years ago • 1 comments

 <td>
        <button class="btn btn-primary btn-sm" hx-get="{% url 'edit_branch' branch.id %}" hx-target="#dialog">Edit
      <li class="fa fa-edit"></li>
    </button>

        <a href="" class="btn btn-warning btn-sm">
            <li class="fa fa-eye"></li>

        </a>
    </td>


;
(function() {
    const modal = new bootstrap.Modal(document.getElementById("modal"))

    htmx.on("htmx:afterSwap", (e) => {
        // Response targeting #dialog => show the modal
        console.log("xxxxxxxxx")
        if (e.detail.target.id == "dialog") {
            modal.show()
        }
    })

    htmx.on("htmx:beforeSwap", (e) => {
        // Empty response targeting #dialog => hide the modal
        if (e.detail.target.id == "dialog" && !e.detail.xhr.response) {
            modal.hide()
            e.detail.shouldSwap = false
        }
    })

    // Remove dialog content after hiding
    htmx.on("hidden.bs.modal", () => {
        document.getElementById("dialog").innerHTML = ""
    })
})()

cfox4ever avatar Feb 03 '23 02:02 cfox4ever

This could be an issue with the django side of the implementation, if the request the edit button fires ends up in a 500 error or doesn't return any content then the modal will never open.

RmaxTwice avatar Mar 23 '23 12:03 RmaxTwice