0

I have a form_tag in my Rails app. When I click on the submit button, the form is re-rendered. I would like to stop the re-rendering and I would like to retain the original form with all the input fields even when the submit button is clicked.

How can I achieve this? Pls help!

<%= form_tag generate_report_path(:header => true) do |f| % >
<div class="container-fluid">
  <div style="padding-right:10px">

    <%= select_tag(:report_id, options_for_select(
      [["Select Report Type", 0],
      ["Report1", 1],
      ["Report2", 2],
      ["Report3", 3]]), id: "report_selection") %>


      <%= hidden_field_tag :format, :pdf %>

I have a select_tag in my form as shown above which the user uses to select the report which he would like to generate (report1 or 2 or 3)

Based on the selection above, a different set of input controls would be displayed right below the select_tag dropdown shown above.

When the user selects the values he likes on the input controls and then clicks on the submit button (labelled as "generate report"), this is what happens:

  • all the input controls that were displayed right below the select_tag dropdown disappear leaving behind only the select_tag dropdown with the default selection (so that the user can once again select the report which he would like to generate)

How can I disable the above step and retain all the input controls (which were displayed below the select_tag dropdown) even after the user clicks the submit button?

Pls help!

m.beginner
  • 389
  • 2
  • 18
  • try return from the generate_report action without redirect. and add `data: { disable_with: false }` to the submit button this will prevent rendering the page again and will retain the page as it is,and you can click on the submit button as much times. – Abhishek Aravindan Jun 24 '19 at 08:42
  • This approach works for me - 1) the form does not change and 2) the excel report also downloads successfully unlike the approach suggested by @Adam . However, there is one minor issue here though -> after I click on the submit button, the button got replaced with a very small rectangle resembling a negative symbol ('-'). – m.beginner Jun 24 '19 at 10:19
  • However, this worked for me like a charm without any issue at all - `<%= button_tag "Generate Report", class: 'btn btn-sm btn-primary'%>` (earlier I was using an HTML button instead of `button_tag` -> ``). It appears the solution is to just replace HTML button with `button_tag` and nothing else needs to be done! – m.beginner Jun 24 '19 at 10:20
  • You could post this as an answer if you'd like and I'll mark it as my answer. Thanks for your inputs - otherwise I would not have tried `button_tag` at all!! – m.beginner Jun 24 '19 at 10:21
  • happy to here it works... i will post as answer ... – Abhishek Aravindan Jun 24 '19 at 10:36

2 Answers2

1

Replace HTML button with button_tag -> <%= button_tag "Generate Report", class: 'btn btn-sm btn-primary'%> and this would fix the page refresh issue.

m.beginner
  • 389
  • 2
  • 18
Abhishek Aravindan
  • 1,432
  • 6
  • 23
  • I have one more related question. I use a checkbox right next to the submit button. When the checkbox is clicked: 1) The report download should not happen and instead it should be rendered in an `ActiveJob` (The rendering inside `ActiveJob` happens fine and that is not an issue). 2) I also to display an alert to the user saying "your report would be emailed to you in a few minutes" contd ... – m.beginner Jun 24 '19 at 10:51
  • check in action whether the checkbox is clicked or not by `if format_reqd == "1" reload else return` – Abhishek Aravindan Jun 24 '19 at 10:54
  • Now, 1) If I use an HTML checkbox, a) the page refreshes but b) the alert gets displayed successfully ` <%= label_tag 'Check for Numeric format' %> ` 2) If I use a `check_box_tag`, a) the page does not refresh but b) the alert does not get displayed either `<%= label_tag do %> <%= check_box_tag "format_reqd", "format_reqd", false %> Check for Numeric format <% end %>` contd ... – m.beginner Jun 24 '19 at 10:56
  • What should I do so that when the checkbox is clicked before clicking the submit button, a) the page should NOT refresh and also b) an alert SHOULD get displayed? – m.beginner Jun 24 '19 at 10:56
  • if you are using a check_box_tag check the `name` of the checkbox after loading the page by inspecting it. the check the in action `if name_of_checkbox == "1" redirect else return` – Abhishek Aravindan Jun 24 '19 at 11:00
  • 1
    In the controller, I do this check -> `if(params[:format_reqd]=="on")` This used to work perfectly for HTML label. Should this be changed if I use `check_box_tag`? – m.beginner Jun 24 '19 at 11:11
  • sorry... You have to use params[:format_reqd] . if this work then no need to use check_box_tag – Abhishek Aravindan Jun 24 '19 at 11:23
  • I have posted a related question here - https://stackoverflow.com/questions/56736155/in-rails-is-it-possible-to-display-an-alert-without-calling-redirect-to-or-rend Could you please help? – m.beginner Jun 24 '19 at 12:05
0

Form_tag support the remote option.

See

https://api.rubyonrails.org/classes/ActionView/Helpers/FormTagHelper.html#method-i-form_tag

try

<%= form_tag(generate_report_path(:header => true), remote: true) do |f| % >

It changes the request into a xml request, so the browser won't refresh page after getting response.

You can read rails guides for more details.

https://guides.rubyonrails.org/working_with_javascript_in_rails.html

adam
  • 94
  • 3
  • this works for me - there's just one issue though. I am rendering an excel report when the submit button is clicked; and the excel report gets downloaded in the browser automatically after it is generated. After I made `remote: true`, the excel templates are being rendered fine; however the download of the report does not happen anymore! Any ideas why this issue and how to fix this? – m.beginner Jun 24 '19 at 09:50
  • I don't know. But I think you have done it. Good job. – adam Jun 25 '19 at 05:09
  • I wonder what's the difference between the HTML code generated by `button_tag` and the normal HTML button which I has used earlier? What would cause page refresh to not happen exactly? It's still not clear! – m.beginner Jun 25 '19 at 06:56