javascript - 刺激 : how to handle repeating items with the same target name

标签 javascript stimulusjs

我有一个项目列表,每个项目都有一个链接可以单击以对其进行编辑。当他们单击该编辑链接时,我正在使用刺激使编辑“模态”表单可见。将要编辑的内容的 id 以 id= 的形式出现在列表的相应链接标签上

因此,编辑链接如下所示:

<td>
  <a data-action="click->content#edit"
     data-target="content.editBtn"
     id="<%= url_for(content) %>")>
    Edit
  </a>
</td>

想法是刺激 Controller 中的 content#edit 操作检查并找到它的 id,并使用它来编辑正确的行。

但是,我认为我遇到的问题是,结果这个列表的所有行都有一个同名的数据目标,而错误的(第一个?)绑定(bind)到目标。

但是,如果我想让每个数据目标不同,例如将 id 附加到它,现在我在 controller.js 中有一长串目标,所以这没有意义。

正确的处理方式是什么?

最佳答案

如果您使用 Rails 作为后端,就像您的其他问题似乎表明的那样,可能有一个更简单的非 Stimulus 解决方案。要使用 Stimulus,您需要从服务器或 DOM 获取项目的数据,将其显示在表单中,然后通过 JavaScript 将具有正确 ID 的正确表单提交给服务器。为什么不为每个项目设置一个远程 link_to 按钮来执行 edit 操作? Rails 收到对 edit Controller 操作的 JS 请求,您可以使用从 Ruby 对象获得的数据加载模态表单。

如果您将 Stimulus 用于表单上的任何内容,我会利用这个机会制作一个 Stimulus Controller 来监听 ajax->send/error/complete 事件并自动禁用/启用按钮,在按钮上设置加载微调器,并关闭模式。这些将是很好的领域,可以加入一些 Stimulus 变得非常简单的功能。

关于javascript - 刺激 : how to handle repeating items with the same target name,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51324326/

相关文章:

javascript - Passport.js:无法读取未定义的属性 'username'( Node )

javascript - 值​stimulus js 无法在 Controller 的单个范围内工作

ruby-on-rails - 如何访问stimulus_reflex中的current_user

javascript - 使用选择刷新 Turbo Frames 而无需在 Rails 7 上提交

javascript - 为什么 jsHint 警告我 : '(var) is defined but never used' ?

javascript - Vuejs 动态输入绑定(bind)和计算不是函数

javascript - 如何将 javascript (js) Map 传递给 spring boot Controller?

javascript - AngularJS:两个选择,第二个选择的选项应该是第一个选择的选项的子集

ruby-on-rails - 使用 Stimulus.js 自动加载弃用警告后 Rspec rails 挂起

ruby-on-rails - 如何将 StimulusJS 安装到 Ruby on Rails 应用程序?