Rails jquery.tagsinput.js not executing after link

111 views Asked by At

Problem

I have a custom effect from a file jquery.tagsinput that does not work after clicking on a link, while it will be fixed if I refresh the page.

Tested Solutions

I tried the following:

  1. Disabling turbolinks
  2. Serching the file for ready or onload js functions - none was present

Description

The file jquery.tagsinput has the following structure

(function($) {
   // Different functions and javascript staff
 })(jQuery);

The function includes different javascript functions that i need to be executed, they work if i refresh the browser. for ex.

$.fn.tagsInput = function(options) { 
   // Some code
 },options);

If I refresh the browser, I can see that the related html input field has two event handlers:

  1. In jquery.tagsinput

        $(data.holder).bind('click',data,function(event) {
            $(event.data.fake_input).focus();
        });
    
  2. In jquery.js

    if ( !( eventHandle = elemData.handle ) ) { 
    // Some Code    
    };
    
  3. My edit.html.erb View

    <%= f.text_field :skill_list, :class => "tagsinput form-control", :id => "tagsinput", value: f.object.skill_list.map { |t| t}.join(', ') %>
    

which generates the following html code:

enter image description here

Thanks a lot

Fabrizio Bertoglio

1

There are 1 answers

0
Fabrizio Bertoglio On BEST ANSWER

This is my application.js, it includes the following files:

//= require jquery.tagsinput
//= require form-component
//= require scripts

Jquery.tagsinput does not have a ready function, but the script.js function does and I the problem started when I edited the script.js ready function.

script.js has the following code:

function initializeJS() {
     // Some js code
}
jQuery(document).ready(function(){
    initializeJS();
});

The problem could have been caused by the editing I have done of the script.js ready function to be compatible with the turbolinks gem (instead of using .save i would use .on('turbolinks:load'..)

jQuery(document).on('turbolinks:load', function(){
    initializeJS();
});

Once i corrected that line, the problem was remove, but I do not have understanding of the real reason it has been fixed. I did not disable turbolinks. I will in the future try to understand the real reason and post an explanation.