Search code examples
ruby-on-railscssturbolinks

CSS of typeahead not working with turbolinks on

The issue is regarding the movement of the text input box after pressing any link on the page.

Turbolinks is on.[If this line of code is removed the problem gets fixed]

//= require jquery.turbolinks

Javascript associated with the search box works ok:

var ready;
ready = function() {

        $('.typeahead').typeahead(null, {
          ...
        });
}

$(document).ready(ready);
$(document).on('page:load', ready);

Also on reload the "Before" state is restored.

The problem is specifically occurring with input boxes tagged with typeahead.

Before: Before

After: After

Solution

  • The search text field had the following Embedded Ruby initially:

    <%= text_field_tag :search, params[:search],class: "address form-control" %>

    Changing it to 

    <%= text_field_tag :search, params[:search],id: "address",class: "form-control" %>

    fixed the problem.