hx-trigger and hx-swap="delete" are not working (maybe I'm totally wrong)

[capymind]

Hello, everyone.
First of all, thanks for maintaining this literally wonderful open source project!

I am an beginner to start developing web.. and have a problem.
The poblem is the user comment is not deleted althouth I think correct attributes & headers...

The symptom is below...

hx-trigger.and.hx-swap.delete.mp4

The comment "Create" and comment count update work so well.
Working code are

python code

@bp_bug.route("/<int:feedback_id>/comments", methods=["POST"])
@login_required
def comment_to_feedback(feedback_id: int):

    # handling user input and database persistence....

    feedback_comment_list_item = get_template_attribute(  👈  make jinja partials using macro
        "bug/components.html.jinja", "feedback_comment_list_item"
    )
    response = make_response(feedback_comment_list_item(feedback_comment=item))  
    response.headers["HX-Trigger"] = "createCommentToFeedback" 👈 Add htmx header

    return response

jinja

<div
      class="[( feedback-comments-display )]"
      hx-get="{{ url_for('feedback.bug.comment_count', feedback_id=feedback.id) }}" 👈 Request comment count update
      hx-trigger="createCommentToFeedback from:body, deleteCommentToFeedback from:body" 👈 Catch custom event 🟢createCommentToFeedback from body (working) 🔴deleteCommentToFeedback from:body  (not working)
      hx-swap="outerHTML"
      data-jinja-component="true"
  >
      <span class="text-muted">댓글 {{ feedback.comment_count }}개</span>
  </div>

python code - update comment count and send hypermedia

@bp_bug.route("/<int:feedback_id>/comment_count", methods=["GET"])
def comment_count(feedback_id: int):
    """get feedback comment count to feedback(depth 1)."""

    feedback = get_feedback(feedback_id=feedback_id)

    feedback_comment_count = get_template_attribute(                      👈  make jinja partials using macro
        "bug/components.html.jinja", "feedback_comment_count"
    )

    return feedback_comment_count(feedback=feedback)                   👈  send update html (working!!)

😱🔴 NOT WORKING comment delete

jinja

<div class="modal-footer">
    <button
        type="button"
        class="btn btn-secondary"
        data-bs-dismiss="modal"
    >
        취소
    </button>
    <button
        type="button"
        class="btn btn-danger"
        hx-delete="{{ url_for('feedback.bug.delete_comment', feedback_id=feedback_comment.feedback_id,  comment_id=feedback_comment.id) }}" 👈  delete request
        hx-target=".feedback-comment-list-item[data-feedback-comment-id='{{ feedback_comment.id }}']" 👈  comment css selector
        hx-swap="delete" 👈  delete comment 
        data-bs-dismiss="modal" 
    >
        삭제
    </button>
</div>

python code - delete comment

@bp_bug.route("/<int:feedback_id>/comments/<int:comment_id>", methods=["DELETE"])
@login_required
def delete_comment(feedback_id: int, comment_id: int):
    """delete specific one comment(by comment id) in specific feedback(by feedback id)."""

    delete_feedback_comment(comment_id=comment_id)

    response = make_response()
    response.headers["HX-Trigger"] = "deleteCommentToFeedback" 👈  htmx header

    # others affected by creation of comment.
    decrease_comment_count_by_one(feedback_id=feedback_id)

    return response, 204

As summary..

• multiple hx-trigger with custom event and response headers not working (createCommentToFeedback from:body, deleteCommentToFeedback from:body)
• hx-swap="delete" not working although I think correct hx-target (such as .feedback-comment-list-item[data-feedback-comment-id='{{ feedback_comment.id }}'])

I think the way I have explain and not having github repository bother you, pushing 'back' button immediately..😅
(Maybe I should come back and question again after studying this topic couple of hours..)

Thanks in advance for putting your valuable times.

[capymind]

I think.. the code that I worte is poor.. it's not htmx problem maybe. I would have to handle this issue by myself for sometime. Sorry for bothering you :)