htmx - 在 HTMX 中按名称引用输入值

Question

我最近开始研究使用 HTMX，但遇到了一个我无法弄清楚的问题。本质上，我有一个选择元素，每当用户进行选择时，我都会使用它来进行 http POST 。但是，为了发布该帖子，我需要提供一个令牌，该令牌存储在有关select的输入中。有没有办法让我在 HTMX 语法中使用名称“csrfmiddlewaretoken”来引用上面的输入？

Answer 1

所以我弄清楚我的问题是什么。为了让我扩展hx-post请求的负载，我需要做的是在 hx-post 请求中包含我想要的内容的 HTML元素。为此，您可以在发出请求的元素上使用hx-include属性，该属性按名称引用其他元素并将它们在有效负载中的值作为 {name: value} 对。

<select name="sample_select" hx-post="link" hx-include="[name='csrfmiddlewaretoken']" hx-trigger="changed">... 

上面的示例 select 将在 select 元素的值发生更改时发出 HTTP Post 请求。然后请求有效负载将是

{
 sample_select: selected_value;
 csrfmiddlewaretoken: value
}

请记住，如果您在同一页面上有多个具有相同名称的元素，当您在hx-include属性中引用该名称时，HTMX 库将从有效负载中的所有元素中获取所有值。我还没有找到引用特定元素或最接近的元素的方法，但如果您知道一种方法，请分享。