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

Question

Is there a way to hide a submit tag in a rails form after it's been clicked?

I have a simple form tag with a submit tag button, which has content that should only be submitted once. So, after a user initially clicks the submit button to send the data in the form tag, I want to hide the button so users cannot click it again.

I tried wrapping it in a div and passing the id into a jquery function, and it hides the button for one second until the page reloads (after it finishes sending the data to the form) but then the button immediately reappears. Any suggestions would be much appreciated!

Edit:

The user has logged in functionality and this is the form

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

Essentially I want to hide this form/button in this case after the user clicks make matches once

Answer 1

Maybe not the jquery answer you are looking for (cause I'm not sure there is one), once you hide something via jquery and the page reload that jquery should re-run in order to hide the button again or you can not show the button in the first place using your erb view there are multiple options here:

if the record in the DB includes a user_id and you can check in your controller that this particular user already submitted the form fill a instance value in your controller eg @already_submited_form = true (true if already submitted false if not) then in the erb view check if for the @already_submited_form if it was then don't show the button

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

if you can't check for a record in the DB then maybe try using cookies in the rails controller: when the user submits their forms and the request hits the controller set a permanent cookie in the browser cookies.permanent[:already_submited_form] = true then reuse the logic from above @already_submited_form = cookies[:already_submited_form]

cookies in rails: https://api.rubyonrails.org/v5.2.1/classes/ActionDispatch/Cookies.html

if the request does not hit a rails controller you can also set a cookie in your js code

if you still want to use jquery to hide this maybe you can use one of these 2 methods to put a data field into the submit button which is generic (data-hide-on-page-load=true) then jquery the elements with that data and hide them (but it seems a bit unnecessary since you can do all this using erb which is one of the advantages of using ruby on rails)