问题标签 [htmx]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
32 浏览

javascript - `xhr.getAllHeaders()` 在浏览器扩展上下文中缺少一些标题?

我正在开发浏览器扩展。在弹出页面上运行的脚本中,我正在发出 ajax 请求。在我的事件处理程序的第一行xhr.onload,我有console.log(xhr.getAllResponseHeaders()). 但是,响应中的某些标头丢失了。我知道这可能是我的 manifest.json 文件的问题,所以在这里,删除了一些额外的细节:

根据网络调试选项卡,这些是实际的响应标头:

但是,这是事件处理程序console.log(xhr.getAllResponseHeaders())第一行的输出:xhr.onloaded

CORS

我应该注意到我没有明显的 CORS 错误。我正在将 Django 与 django-cors-headers 库一起使用,并且我拥有所有这些标头,包括我试图调试的关键 Hx-Trigger 标头,特别是明确列为允许的标头(尽管我很确定该列表是只应该用于传入的请求标头,但无论如何)。

你知道为什么getAllResponseHeaders()缺少这么多实际的标题吗?

0 投票
1 回答
118 浏览

flask - 在烧瓶 wtforms jinja select 上设置动态数据属性

有一个烧瓶 wtforms 选择字段并尝试合并 htmx ajax 调用,它在数据属性中有破折号,所以我在 SO 上找到了一个解决方案,如下所示:

但是模板没有解析{{pulley_id}},我猜它已经在另一个{{}}中了。有没有一种方法可以构建如上所示的动态部分,所以它最终成为

当 pulley_id=1 完全渲染时

0 投票
4 回答
184 浏览

http-status-codes - 处理 http post 时使用哪些 http 状态代码?

我有一个 HTML 表单,我通过 http post 提交。

有两种情况:

  • 情况一:数据有效,服务器上的数据会相应更新
  • 情况 2:数据无效,http 响应包含用户的错误消息。

每种情况应使用哪些 http 状态代码?

我使用htmx提交表单。这意味着我不需要使用 POST/Redirect/GET 模式。

这个问题与 JSON-API 无关。

0 投票
1 回答
98 浏览

javascript - 使用 htmx 和 tinymce 时出现错误列表

我正在尝试使用 htmx 实现发布请求,并使用 tinymce 实现富文本编辑器。

我的表格:

我得到的错误:

当我使用 TinyMCE 的传统发布请求时,它工作得很好。

当我在没有 TinyMCE 的情况下使用 htmx 时,它的工作也很好。

就在我结合 htmx 和 TinyMCE 时,我得到了错误。

我的tinymce初始化:

0 投票
1 回答
403 浏览

javascript - 我们如何使 htmx 响应触发表单重置?

我正在创建一个非常基本的 Django 消息传递应用程序,并希望htmx用于发送和呈现消息。我能够毫无问题地发布、保存消息并呈现部分消息。但是,我遇到了一个奇怪的问题,我的表单 textarea 没有被重置。所以,我会发送一条消息,插入交换后,我的旧消息仍会在 textarea 中。这不是很理想!

我试图通过添加一个 onclick 事件来手动清除文本区域,如下所示:

html

脚本(https://stackoverflow.com/a/14589251/12758446

尽管message_form.submit()在 submitForm() 中有,但我的表单没有被提交,但 textarea 正在重置。

问题:

成功发送和呈现消息后,我将如何重置我的 textarea?

Django 视图,基于https://github.com/legionscript/socialnetwork/blob/84375841429887e394a2a31e1b67919f81a3cb06/social/views.py#L428

0 投票
1 回答
75 浏览

htmx - HTMX 加载后触发自定义事件

想象一个选项卡式面板。我对 tab1 中的数据进行了一些更改,然后我使用 HTMX 在 tab1 中发布和交换内容。现在,tab1中可能有部分信息,当我更改它时,我还必须刷新tab2的内容。

我想将 tab2 设置为hx-trigger="my-custom-event-when-tab-1-updates-the-special-place". 都好。但现在我想通知 HTMX 在加载/交换 tab1 的特定部分后引发此事件。

我该怎么做?

或者在这些情况下有没有更容易做的不同方法?

这基本上是在 UI 中处理副作用的问题。是的,你做了一件事,但现在其他事情也需要发生。

0 投票
1 回答
207 浏览

django - htmx 和 django 基于类的视图

我试图将倒计时教程从这里转换为基于类的视图,但我不知道缺少什么。

视图.py

base.html

0 投票
1 回答
92 浏览

htmx - 使用 Hyperscript 清除提交时的所有输入字段

我正在使用 htmx 和超脚本,我希望在提交时清除以下表单中的所有输入字段:

我试过用<what should I write here??>egon submit put '' into <input/>on submit put '' into <input[value]/>许多其他组合替换,但我没能完成这项工作。

问:提交表单时如何清除所有输入字段?

0 投票
1 回答
77 浏览

htmx - 当所有输入字段在 Hyperscript 中有效时启用提交按钮?

我正在使用 htmx 和超脚本,我希望在所有必需的输入字段在表单中都有效时启用“提交按钮”(添加用户)。在这种情况下,必须定义一个非空名称和一个有效的电子邮件地址。

我应该写什么而不是<what should I write here??>让这发生?

0 投票
1 回答
118 浏览

python - 使用 HTMX 时表单未提交到数据库

我有以下模型,如您所见,它们彼此相关

本质上,潜在客户条目与潜在客户相关,我使用 HTMX 基本上使用表单将数据添加到 LeadEntry 数据库。

形式

我有 2 个视图,一个将简单地传递一个带有按钮的 HTML,供用户将条目添加到数据库,另一个视图具有实际表单

意见

最后,有 2 个 HTML 页面,第一个与 add_to_forecast 相关联并呈现一个简单的页面,这是 HTMX 发生的地方,它从下一个 HTML 页面添加表单

用户想要添加多少次的表单

我遇到的问题是,提交表单后,一切似乎都在工作,显然,目前您只能提交一个潜在客户,因为我仍然需要添加更多逻辑,但目前表单没有将数据发送到DB,经过一些调试,我无法通过 POST,似乎只是没有提交任何东西。

任何帮助将不胜感激


更新 - 2021 年 12 月 4 日

我尝试使用表单提交数据,它确实有效,所以提交POST.request的表单没有问题,如果我直接进入URL,它工作正常,所以表单提交正确并且数据库是更新。

我仍然不明白为什么当表单由 htmx 呈现时不起作用,所以它与此有关。