我正在使用django和htmx来更新表单上的一个字段，下面是显示单选按钮的代码和我尝试触发的尝试。但它不会触发。我做错了什么？

{% extends 'core/base.html' %}

{% block title %}Booking{% endblock %}

{% block content %}
<div class="container">
  <div class="form-group">
    <div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4">
      <div class="col text-center p-1">
        <form method="POST" action=".">
            {% csrf_token %}
            <legend>{{s_form.species.name.title}}</legend>
            <div hx-get="{% url 'book_services' %}" hx-trigger="change from:find .btn-check" hx-target="#book-services">
            {% for choice in s_form.species.field.choices %}
            <input type="radio" class="btn-check" name="{{s_form.species.name}}"
              id="id_{{s_form.species.name}}_{{choice.0}}" autocomplete="off">
            <label class="btn btn-outline-primary btn-lg m-1 col"
                 for="id_{{s_form.species.name }}_{{choice.0}}"> 
              {{choice.1}}</label>
            {% endfor %}
          </div>
        </form>
      </div>
      <div class="col text-center p-1 border">
        <h5 class="text-lg">Service</h5>
        <div id="book-services" data-hx-trigger="load,bookSerivesChanged from:body"
          data-hx-get="{% url 'book_services' %}" data-hx-target="this"></div>
      </div>
    </div>
    <div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4">
      <div class="col border">Date</div>
      <div class="col border">Time</div>
    </div>
  </div>
</div>
{% endblock %}

字符串
我已经尝试将扳机从一个移动到形式，而不是运气。