The form_for (inside a modal) cannot be submitted unless I refresh the page. It seems like the submit button is disabled or not working properly. I have tried disabling Turbo by adding data-turbo=”false” to the form, but the issue persists.

Interestingly, this problem occurs in Chrome but not in Firefox. In Firefox, the form submits correctly without needing a page refresh.

I have checked the browser’s console and there are no JavaScript errors or warnings. What could be causing the form to fail to submit without a page refresh in Chrome but work fine in Firefox?

Here is the relevant code snippet from my view:

<% if current_user.manager? || current_user.coordinator? %>
                <td>
                  <button type="button" style="margin:0" class="btn-etendart-yellow" data-bs-toggle="modal" data-bs-target="#modal-<%= receiver.id %>">
                    Déposer
                  </button>
                  <div class="modal fade" id="modal-<%= receiver.id %>" tabindex="-1" aria-labelledby="modalLabel-<%= receiver.id %>" aria-hidden="true">
                    <div class="modal-dialog">
                      <div class="modal-content" style="width:80%;padding:0px">
                        <div class="modal-header modal-header-deposit">
                          <h1 class="modal-title fs-5" id="modalLabel-<%= receiver.id %>"><%= receiver.full_name %> le <%= l(Date.current, format: :default) %></h1>
                          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                        </div>
                        <div class="modal-body">
                          <%= form_for MembershipDeposit.new, url: managers_membership_deposits_path, data: { turbo: false } do |f| %>
                            <%= f.hidden_field :depositor_id, value: receiver.id %>
                            <div class="mb-3 row align-items-center">
                              <%= f.label :cash_amount, "Espèces (€) :", class: "col-5" %>
                              <%= f.number_field :cash_amount, class: "form-deposit col-4" %>
                            </div>
                            <div class="mb-3 row align-items-center">
                              <%= f.label :cheque_amount, "Chèque (€) :", class: "col-5"%>
                              <%= f.number_field :cheque_amount, class: "form-deposit col-4"%>
                            </div>
                        </div>
                        <div class="modal-footer d-flex justify-content-around">
                          <button type="button" class="btn-add-student btn-add-student-small btn-add-student-grey" data-bs-dismiss="modal">Annuler</button>
                          <div>
                            <%= f.submit "Valider", class: "btn-add-student btn-add-student-small" %>
                          </div>
                        </div>
                        <% end %>
                      </div>
                    </div>
                  </div>
                </td>
              <% end %>

I have checked the browser’s console and there are no JavaScript errors or warnings