Twitter Bootstrap Question posted in

Rails 4.2.7 submit remote form's event triggering twice – Twitter bootstrap

I am stuck in a question that seems well documented on forums (included Stackoverflow), but none of those topics could helped me to solve the issue.
In few words, all over the application my remote calls to controllers are being triggered twice. I read somewhere that it could be a jQuery duplication issue, but as you can see in my application.html.erb and application.js is probabily not, because jQuery appears once. Another solution that appears in other questions is remove turbolinks, but that didn’t neither solved my issue.

Example of the error i am facing:
I have a form rendered using simple_form which submits a GET request to an action. 

         <%= simple_form_for :create_answer, url: create_answer_path, remote: true do |f| %>
                  <b>Intenção</b>
                  <%= f.input :intents, :class=> "form-control", label: false%>

                 <b>Entidades</b>
                 <%= f.input :entities, :class=> "form-control", label: false%>

                  <b>Valores</b>
                  <%= f.input :values, :class=> "form-control", label: false%>

                 <b>Text</b>
                  <%= f.text_area :text, :class=> "form-control", label: false%>

                  <p class="text-center" style="margin-top:5px;">
                   <%= f.submit "Criar", :class => "btn btn-primary" %>
                  </p>
                <% end %>

When the user clicks on submit the action is triggered twice, as you can see on console log:
enter image description here
As i am dealing with a paid remote API on this action, call it twice would be unacceptable.

Here is my applicatipon.html.erb file:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <META HTTP-EQUIV="refresh" CONTENT="<%=@seconds_left%>">
    <title>S2Chat</title>
    <%= csrf_meta_tags %>


<script src="https://js.pusher.com/4.0/pusher.min.js"></script>


<script type="text/javascript">
  $(function(){
    $("#dropDown").dropdown();
  });
</script>

<%= stylesheet_link_tag "application", :media => "all" %>
<%= yield(:page_stylesheet) if content_for?(:page_stylesheet) %>


<style type="text/css">
  body{
    overflow-x: hidden;
  }

  .verticalCenter {
    min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
    min-height: 100vh; /* These two lines are counted as one :-)       */

    display: flex;
    align-items: center;
  }

  .audios{
    display: none;
  }
</style>


<audio class="audios" id="new_attendance_audio" controls preload="none"> 
  <source src="/assets/door_bell.mp3" type="audio/mpeg">
</audio>

<audio class="audios" id="new_message_audio" controls preload="none"> 
  <source src="/assets/message_alert.mp3" type="audio/mpeg">
</audio>

<audio class="audios" id="attendance_finished_audio" controls preload="none"> 
  <source src="/assets/error1.mp3" type="audio/mpeg">
</audio>    


<!-- Fixed navbar -->
<div class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="/home/index" style="color:white;">S2Chat</a>
    </div>
    <% if user_signed_in == true%>
      <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav navbar-right">
          <li id="dropDown" class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" style="color:white;">
              <%=cookies.encrypted[:user_fullname]%><b class="caret"></b>
            </a>
            <ul class="dropdown-menu">
              <li class="dropdown-header">Conta</li>
              <li>
                <% if cookies.encrypted[:user_type] == "attendant"%>
                  <%= link_to "Sair", delete_session_path, method: :delete, :data => {:confirm => 'Ao deslogar-se, todos os atendimentos que você está envolvido serão automaticamente finalizados. Você tem certeza que deseja sair?'}%>
                <%else%>
                  <%= link_to "Sair", delete_session_path, method: :delete%>
                <%end%>
              </li>
            </ul>
          </li>
        </ul>  
      </div>
    <% end%>
  </div>
</div>


<div>
  <%= yield %>
</div>

<!-- Javascripts
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<%= javascript_include_tag "application" %>

Here is my application.js:

    //= require jquery
    //= require jquery_ujs
    //= require twitter/bootstrap 
    //= require_tree .

And here is my Gemfile:

source 'https://rubygems.org'

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.2.7.1'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.1.0'
# See https://github.com/rails/execjs#readme for more supported runtimes
gem 'therubyracer', platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'

   # Turbolinks makes following links in your web application faster. Read    more: https://github.com/rails/turbolinks

   # Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
  gem 'jbuilder', '~> 2.0'
  # bundle exec rake doc:rails generates the API under doc/api.
  gem 'sdoc', '~> 0.4.0', group: :doc
  gem "excon"
  gem "rails_12factor"
  gem 'rails_12factor', group: :production
  gem 'simple_form'
  gem "less-rails" #Sprockets (what Rails 3.1 uses for its asset pipeline)    supports LESS
  gem 'twitter-bootstrap-rails'
  # twitter bootstrap css & javascript toolkit
  #gem 'twitter-bootswatch-rails', '~> 3.3.4'
  # twitter bootstrap helpers gem, e.g., alerts etc...
  #gem 'twitter-bootswatch-rails-helpers'
  # Use ActiveModel has_secure_password
  # gem 'bcrypt', '~> 3.1.7'
  # Use Unicorn as the app server
  # gem 'unicorn'
  # Use Capistrano for deployment
  # gem 'capistrano-rails', group: :development
  source 'https://rails-assets.org' do
     gem 'rails-assets-tether', '>= 1.3.3'
     end
      group :development, :test do
       # Call 'byebug' anywhere in the code to stop execution and get a        debugger console
     gem 'byebug'
   end

   group :development do
         # Access an IRB console on exception pages or by using <%= console %> in views
     gem 'web-console', '~> 2.0'

 # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring
 gem 'spring'
  end

Can anyone help me? Thanks

Tags:

2

Answers


  1. 0

    disable_with attribute doesn’t help?

    Login or Signup to reply.
  2. 0

    From the snippet that you’ve provided, it doesn’t look like your action is triggering twice, but rather than your log entries are duplicated.

    rails_12factor is the likely culprit here, and it looks like you have it listed twice in your Gemfile. This will be outputting your logs to stdout and to the Rails logger, so they’ll appear in your terminal twice.

    Remove gem "rails_12factor" and keep gem 'rails_12factor', group: :production. Then bundle and restart Rails server, and the problem should go away.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search