Rails turbolinks break submit remote form

前端 未结 2 1322
轻奢々
轻奢々 2021-01-06 20:37

I\'m having a rather weird problem using Rails 4, Turbolinks and a remote form. I have a form looking like:

<%= form_for [object], remote: true do |f| %&g         


        
相关标签:
2条回答
  • 2021-01-06 20:51

    Turbolinks

    As mentioned, the problem with Turbolinks is that it reloads the <body> part of the DOM with an ajax call - meaning JS is not reloaded, as it's in the head

    The typical way around this issue is to delegate your JS from the document, like this:

    $(document).on("click", "#your_element", function() {
        //your code here
    });
    

    Because document is always going to be present, it will trigger the JS continuously


    Remote

    With your issue, it's slightly more tricky

    The problem is you're relying on the JQuery UJS (unobtrusive JavaScript) engine of Rails, which is difficult to remedy on its own

    We've never had this issue & we use Turbolinks all the time - so I suppose the problem could be with how you're constructing your form / handling the request. This GitHub seemed to recreate the issue, and it was to do with the table

    Maybe you could try:

    <%= form_for [object], remote: true do |f| %>                                                   
        <%= f.text_field :name, class: 'form-control' %>                                     
        <%= f.email_field :email, class: 'form-control' %>                              
        <%= f.submit button_name, class: 'btn btn-sm btn-primary' %>
    <% end %>    
    
    0 讨论(0)
  • 2021-01-06 21:05

    Turbolinks don't fully reload your page, but only part of it. This is what makes them so fast, however if you have JavaScript requiring a full page reload you will run into trouble. The reason it does work with a refresh is because now you force the page to fully reload.

    Edit: This gem might be worth trying out: https://github.com/kossnocorp/jquery.turbolinks

    For a little bit of extra information about the inner workings of turbolinks: http://guides.rubyonrails.org/working_with_javascript_in_rails.html#turbolinks

    Or: https://github.com/rails/turbolinks

    P.s. Also make sure the javascript_include_tag is within the head tag (and not in the body)

    0 讨论(0)
提交回复
热议问题