使用 js/jquery 在 ruby​​ on rails 中隐藏 form_tag 上的提交按钮

Posted 2023-05-09

【中文标题】使用 js/jquery 在 ruby​​ on rails 中隐藏 form_tag 上的提交按钮

【英文标题】：Hide submit button on form_tag in ruby on rails with js/jquery

【发布时间】：2021-07-06 11:56:09

【问题描述】：

有没有办法在点击后在 Rails 表单中隐藏提交标签？

我有一个带有提交标签按钮的简单表单标签，它的内容只能提交一次。因此，在用户最初单击提交按钮以发送表单标签中的数据后，我想隐藏该按钮，以便用户无法再次单击它。

我尝试将它包装在一个 div 中并将 id 传递给一个 jquery 函数，它会隐藏按钮一秒钟，直到页面重新加载（在完成将数据发送到表单之后），然后按钮立即重新出现。任何建议将不胜感激！

编辑：

用户已登录功能，这是表单

<% form_tag matches_update_path method: :post%>
<% submit_tag “Make Matches?” %> 
<% end %>

基本上我想在用户点击一次匹配后隐藏这个表单/按钮

【问题讨论】：

您也应该向我们提供 html 内容 :)

用户是否有任何类型的 id？ （登录用户或类似的东西？）

如何知道是否已经提交？也许你可以在你的模型中添加一个 is_submitted 标志，然后在提交时隐藏按钮

所有好的建议！谢谢大家

【参考方案1】：

也许不是您正在寻找的 jquery 答案（因为我不确定是否有），一旦您通过 jquery 隐藏某些内容并且页面重新加载，jquery 应该重新运行以便再次隐藏按钮，或者您可以不使用您的 erb 视图首先显示按钮这里有多个选项：

如果数据库中的记录包含user_id，并且您可以在您的控制器中检查该特定用户是否已提交表单，在您的控制器中填写一个实例值，例如@already_submited_form = true (true if already submitted false if not)，然后在erb 视图中检查是否@already_submited_form 如果是则不显示按钮

<% form_tag matches_update_path method: :post%>
  <% unless @already_submited_form %>
    <% submit_tag “Make Matches?” %> 
  <% end %>
<% end %>

如果您无法检查数据库中的记录，那么可以尝试在 rails 控制器中使用 cookie：当用户提交表单并且请求到达控制器时，在浏览器中设置永久 cookie cookies.permanent[:already_submited_form] = true 然后重用上面的逻辑@already_submited_form = cookies[:already_submited_form]

rails 中的 cookie：https://api.rubyonrails.org/v5.2.1/classes/ActionDispatch/Cookies.html

如果请求没有命中 Rails 控制器，你也可以在你的 js 代码中设置一个 cookie

如果您仍然想使用 jquery 来隐藏它，也许您可​​以使用这两种方法之一将数据字段放入通用的提交按钮（data-hide-on-page-load=true）然后 jquery具有该数据的元素并隐藏它们（但这似乎有点不必要，因为您可以使用 erb 完成所有这些操作，这是在 Rails 上使用 ruby​​ 的优点之一）