本文详解 Django 项目中结合 htmx 提交表单时无法获取 input 值（如 quantity）的根本原因及修复方案，重点指出混用 hx-get 与表单 POST 的冲突问题，并提供可立即生效的 HTML + 视图配置。

本文详解 django 项目中结合 htmx 提交表单时无法获取 input 值（如 quantity）的根本原因及修复方案，重点指出混用 `hx-get` 与表单 post 的冲突问题，并提供可立即生效的 html + 视图配置。

在使用 htmx 实现无刷新加购功能时，一个常见却容易被忽视的问题是：表单数据未随请求发送，导致 request.POST.get('quantity') 返回 None。根本原因在于你当前的 HTML 结构存在逻辑矛盾——

使用了 method="post"，但提交按钮却通过 hx-get 发起 GET 请求，这导致浏览器完全绕过了表单序列化流程， 的值自然不会被包含在请求中。

✅ 正确做法是：让 htmx 管理整个表单提交行为，而非仅绑定到按钮。只需两步修改：

1. 将 hx-post 移至 标签上，并移除按钮上的 hx-get；
2. 确保按钮为 type="submit"（保持原样即可），由表单触发 htmx 请求。

修正后的 HTML 示例：

Django Unfold

提供使用 django-unfold (v0.56+) 构建高级 Django 管理界面的专业指导。当用户提及 django-unfold、unfold admin 等内容时使用此技能。

下载

<form 
  method="post" 
  hx-post="{% url 'Add product page' product.slug %}" 
  hx-trigger="submit"
  hx-target="#cart-summary"  <!-- 可选：指定更新区域 -->
>
  {% csrf_token %}
  <div class="body-product__actions">
    <div data-quantity class="body-product__quantity quantity">
      <button data-quantity-minus type="button" class="quantity__button quantity__button_minus"></button>
      <div class="quantity__input">
        <input 
          data-quantity-value="True" 
          autocomplete="off" 
          type="number" 
          name="quantity" 
          value="1" 
          min="1" 
          step="1"
        >
      </div>
      <button data-quantity-plus type="button" class="quantity__button quantity__button_plus"></button>
    </div>

    <button 
      data-ripple 
      type="submit" 
      class="body-product__add-to-cart button button_cart"
    >
      <span class="_icon-cart-plus">Add to cart</span>
    </button>

    <a href="#" class="body-product__cicil border-button border-button_cicil">
      <img src="{% static 'mstore/img/icons/cicil.svg' %}" alt="cicil">
    </a>
  </div>
</form>

⚠️ 关键注意事项：

• hx-post 必须放在
  上，htmx 才会自动收集该表单内所有 name 属性的输入字段（包括 quantity）并以 POST 方式发送；
• hx-trigger="submit" 明确声明监听表单提交事件（兼容原生 submit 和 htmx 提交）；
• 输入类型建议改为 type="number" 并添加 min="1"，避免非法值干扰后端逻辑；
• 后端视图中，务必对 quantity 做类型转换和校验（原代码直接赋值字符串会导致数据库报错）：

# views.py（优化版）
quantity = request.POST.get('quantity')
if not quantity or not quantity.isdigit() or int(quantity) < 1:
    return HttpResponseBadRequest("Invalid quantity")

quantity = int(quantity)  # ✅ 转为整数再赋值
orderItem.quantity = quantity
orderItem.save()

? 额外提示：若需支持“点击按钮即提交”（不依赖回车或显式 submit），可为 +/- 按钮添加 hx-trigger="click" 和 hx-post，但需配合 hx-include 动态注入当前 quantity 值——不过对于标准加购场景，表单级 htmx 提交是最简洁、最符合语义的方案。

遵循以上调整，request.POST.get('quantity') 将稳定返回预期数值，彻底解决 None 问题。