try installing this gem, it should help sort the jquery issues regarding turbolinks jquery turbolinks
Forms not submitting inside Bootstrap modal with Turbolinks turned on Rails 4
-
23-09-2022 - |
Вопрос
I've made forms to be submitted in modals provided by Bootstrap 3.0. However the forms only submit when I refresh the page and not when the pages get turbolinked. On turbolinking I can keep clicking the submit button and nothing happens. This only happens in production for some reason.
Removing turbolinks fixes the problem but I want the speed gains from it.
One issue I think it could be is that the modals are initially display:none; so it may be an issue that the forms are not loaded properly.
I'll test form submissions without the modals but it's a must for the application I'm making.
deals_controller.rb
def create
@deal = Deal.new(deal_params)
@deal.team = @team
@deal.user_id = current_user.id
respond_to do |format|
if @deal.save
format.html { redirect_to team_deals_path(@team), notice: 'Deal was successfully created.' }
format.json { render action: 'show', status: :created, location: @deal }
else
@deals = @team.deals.all
iwantmodal
should_modal_be_open
format.html { render action: 'index' }
format.json { render json: @deal.errors, status: :unprocessable_entity }
end
end
end
I have the form located in the index action itself.
_form.html.erb
<div id="dealModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">New Deal</h4>
</div>
<div class="modal-body">
<%= simple_form_for([@deal.team, @deal]) do |f| %>
<%= f.error_notification %>
<div class="form-inputs">
<%= f.input :person_id do %>
<%= f.input_field :person_id, :collection => @team.people, class: "col-lg-10" %>
<%= link_to content_tag(:i, nil, class: 'glyphicon-plus'), new_team_person_path, type: 'button', class: 'btn btn-success col-lg-2' %>
<% end %>
<%= f.input :organization_id do %>
<%= f.input_field :organization_id, :collection => @team.organizations, class: "col-lg-10" %>
<%= link_to content_tag(:i, nil, class: 'glyphicon-plus'), new_team_organization_path, type: 'button', class: 'btn btn-success col-lg-2' %>
<% end %>
<%= f.input :title %>
<%= f.input :value %>
<%= f.input :currency_id, :include_blank => false , :collection => Currency.all, label_method: lambda { |obj| t("#{obj.extension}") } %>
<%= f.input :start_date, :as => :datetime_picker, input_html: {class: "deal_start_date"} %>
<%= f.input :close_date,:as => :datetime_picker, input_html: {class: "deal_close_date"} %>
<%= f.input :status, collection:['Pending', 'Won','Lost'], :include_blank => false %>
<%= f.input :phone %>
<%= f.input :visibility_id, collection: Visibility.all,:include_blank => false %>
<%= f.input :email %>
<%= f.input :stage_id, :collection => @team.stages, :include_blank => false %>
</div>
</div>
<div class="modal-footer">
<div class="form-actions">
<%= f.button :submit, class:"btn btn-primary", remote: true, method: :post %>
</div>
</div>
<% end %>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script type="text/javascript">
if(<%= @modal %>) {
$('#dealModal').modal('show')
}
</script>
The script is just used to keep the modal open in case there are validation errors in the form.
Решение
Другие советы
Try adding the following to your form:
remote: true
And then add:
format.js
to your controller action.
This way the form will be submitted using some javascript magic. You'll need to wire up the js.erb templates too.