<form
class="" id="form" hx-post="/add/" hx-swap="afterbegin" hx-target="#big_list" hx-trigger="submit">
<input type="text" name="langue1" >
<input type="text" name="langue2">
<div id="errors"></div>
<button type="submit">GO</button>
</form>
<div id="big_list">
.....
</div>
Run Code Online (Sandbox Code Playgroud)
我有一个很大的列表#big_list
,我希望#form
在提交时只附加一行。
如何使用 htmx 处理错误并在 中显示消息#errors
?
如何使用提交按钮或表单外的输入类型提交来提交表单?在 HTML 中,使用表单 ID 可以轻松完成,但我没有找到在 HTMX 表单之外提交表单的方法?
有人可以在这方面提供帮助吗?
我想向我的应用程序发送 PATCH 请求,但我不确定如何在 Django 中使用该请求。我目前收到以下错误。
AttributeError: 'WSGIRequest' object has no attribute 'PATCH'
Run Code Online (Sandbox Code Playgroud)
HTMX 文件中的输入字段如下所示(我还确保发送 CSRF 令牌):
<input
name="myfield"
hx-patch="{% url 'my_update' myobj.id %}"
hx-swap="none" />
Run Code Online (Sandbox Code Playgroud)
这是 Django 视图
class MyHtmxView(View):
def patch(self, request, *args, **kwargs):
form = MyForm(request.PATCH)
if form.is_valid():
form.save()
# return an okay status? 200?
else:
return HttpResponse(self.form_invalid(form))
Run Code Online (Sandbox Code Playgroud)
Django 正在接收请求,但不确定如何处理 request.PATCH。我可以在 Django 文档中看到有 HttpRequest.GET 和 HttpRequest.POST 但没有 HttpRequest.PATCH https://docs.djangoproject.com/en/3.2/ref/request-response/#httprequest-objects。处理补丁的最佳方法是什么?
这按照我想要的方式工作:如果<select>
发生更改,则触发htmx 。
<script src="https://unpkg.com/htmx.org@1.1.0"></script>
<table>
<tr hx-post="//example.com" hx-trigger="change">
<td>
<select name="runner">
<option value="a">a</option>
<option value="b">b</option>
</select>
</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
如果我使用 django-autocomplete-light 小部件,那么它不起作用。
我使用这个版本:django-autocomplete-light==3.8.1
我正在使用htmx向我的页面添加一些 AJAX 调用。我有一个cart-count
元素,定义为在页面加载后 1 秒内检索购物车中的商品数量:
<span id="cart-count" hx-get="/cart/count"
hx-trigger="load delay:1s" hx-target="#cart-count" hx-swap="outerHTML">
</span>
Run Code Online (Sandbox Code Playgroud)
我还有一个add-to-cart
按钮,在它自己的东西之后(例如将其自身更改为remove from cart
使用 htmx),发送一个额外的属性
response['HX-Trigger-After-Swap'] = "cart-updated"
Run Code Online (Sandbox Code Playgroud)
到前端(请参阅此处的文档)。
我有一个有效的事件侦听器,
document.body.addEventListener("cart-updated",
function (evt) {
alert("cart updated")
})
Run Code Online (Sandbox Code Playgroud)
但是我怎样才能触发JS中的元素呢hx-get
?#cart-count
注意
hx-trigger="load delay:1s, cart-updated"
Run Code Online (Sandbox Code Playgroud)
如果购物车内容位于元素的父链中,则可以工作add-to-cart
,但不幸的是,我的网页并非如此。
请注意,这里也提出了这个问题
我想用我自己的方法初始化一个select
元素,如tom-select 示例中的元素:
<select id="select-repo" placeholder="Pick a repository..." multiple></select>
Run Code Online (Sandbox Code Playgroud)
function my_select_init(el) {
new TomSelect(el, {
persist: false,
createOnBlur: true,
create: true
})
}
Run Code Online (Sandbox Code Playgroud)
有两种不同的方式:
在这种情况下,您可以使用现代 onLoad 方法之一。
例如:
document.addEventListener('DOMContentLoaded', function () {
// do something here ...
}, false);
Run Code Online (Sandbox Code Playgroud)
如何初始化片段?
我希望 HTML 和加载代码位于一处(行为局部性),并且我希望该 html 片段在两种情况下都相同。
到目前为止,我没有使用 Hyperscript 或 Alpine.js,但我愿意使用这些库之一,如果这能让解决方案更简单的话。
HTMX 非常棒,并且使用 AJAX 来完成大部分工作也非常棒!但有时我只需要真正的“物理”重定向到另一个页面。
有什么想法如何在不开始编写自定义 JS 代码的情况下实现这一目标吗?
谢谢!
我正在创建一个非常基本的 Django 消息应用程序,并想用它htmx
来发送和呈现消息。我可以毫无问题地发布、保存消息并呈现部分消息。但是,我遇到了一个奇怪的问题,我的表单文本区域没有被重置。因此,我会发送一条消息,插入交换后,我的旧消息仍会在文本区域中。这不太理想!
我尝试通过添加 onclick 事件来手动清除文本区域,如下所示:
网页
<div id="new-message-div"></div>
<form id="message-form" class="chat-form rounded-pill bg-dark" data-emoji-form="" hx-post="{% url "chat:create-message" object.pk %}" hx-target="#new-message-div">
...
{{ message_form }}
...
<button class="btn btn-icon btn-primary rounded-circle ms-5" type="submit" onclick="submitForm()"> </button>
</form>
Run Code Online (Sandbox Code Playgroud)
<script>
function submitForm() {
var message_form = document.getElementById('message-form');
message_form.submit(); // Submit the form
message_form.reset(); // Reset all form data
return false; // Prevent page refresh
}
</script>
Run Code Online (Sandbox Code Playgroud)
尽管在submitForm()中有message_form.submit()
,我的表单没有被提交,但文本区域正在重置。
问题:
成功发送和渲染消息后,如何重置我的文本区域?
def create_message(request, pk):
message …
Run Code Online (Sandbox Code Playgroud) 我目前正在使用 django 和 htmx 构建一个网站,到目前为止我很喜欢这个组合。假设我在按钮上使用 htmx 属性,将 DOM 中的一个 div 替换为另一个应该包含所见即所得编辑器的 div。现在必须使用 javascript 初始化所见即所得编辑器。我该怎么做呢?我可以只返回 htmx 请求的编辑器 div 下的脚本标签吗?这不是有点丑陋或不好的做法吗,因为你在 html 正文的中间有脚本标签?解决这个问题的最好方法是什么?提前致谢