rails jquery.turbolinks javascript在页面更改后没有触发

已经广泛记录了这个问题(或者它的味道),但是尽管我的调查和阅读仍然无法解决这个问题,…

安装了以下gem的Rails 4应用程序：

Using rake 10.3.2
Using i18n 0.6.11
Using json 1.8.1
Using minitest 5.4.1
Using thread_safe 0.3.4
Using tzinfo 1.2.2
Using activesupport 4.1.4
Using builder 3.2.2
Using erubis 2.7.0
Using actionview 4.1.4
Using rack 1.5.2
Using rack-test 0.6.2
Using actionpack 4.1.4
Using mime-types 1.25.1
Using polyglot 0.3.5
Using treetop 1.4.15
Using mail 2.5.4
Using actionmailer 4.1.4
Using activemodel 4.1.4
Using arel 5.0.1.20140414130214
Using activerecord 4.1.4
Using execjs 2.2.1
Using autoprefixer-rails 3.0.1.20140826
Using bcrypt 3.1.7
Using sass 3.2.19
Using bootstrap-sass 3.2.0.2
Using bootstrap-select-rails 1.6.2
Using thor 0.19.1
Using railties 4.1.4
Using bootswatch-rails 3.2.4
Using breadcrumbs_on_rails 2.3.0
Using cancan 1.6.10
Using coffee-script-source 1.8.0
Using coffee-script 2.3.0
Using coffee-rails 4.0.1
Using data-confirm-modal 1.0.1 from git://github.com/ifad/data-confirm-modal.git (at master)
Using datetimepicker-rails 3.1.1 from git://github.com/zpaulovics/datetimepicker-rails.git (at master)
Using orm_adapter 0.5.0
Using warden 1.2.3
Using devise 3.3.0
Using hike 1.2.3
Using multi_json 1.10.1
Using tilt 1.4.1
Using sprockets 2.11.0
Using intellij-coffee-script-debugger 0.0.1 from git://github.com/JetBrains/intellij-coffee-script-debugger.git (at master)
Using jbuilder 2.1.3
Using jquery-rails 3.1.2
Using sprockets-rails 2.1.4
Using sass-rails 4.0.3
Using jquery-datatables-rails 2.2.3
Using turbolinks 2.3.0
Using jquery-turbolinks 2.1.0
Using momentjs-rails 2.7.0
Using nested_form 0.3.2
Using pg 0.17.1
Using bundler 1.6.4
Using rails 4.1.4
Using rdoc 4.1.1
Using sdoc 0.4.1
Using simple_form 3.1.0.rc2
Using spring 1.1.3
Using sqlite3 1.3.9
Using uglifier 2.5.3
Using will_paginate 3.0.7

我的application.js清单如下：

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require_self
//= require_tree .
//= require bootstrap-sprockets
//= require data-confirm-modal
//= require allPages
//= require moment
//= require bootstrap-datetimepicker
//= require pickers
//= require locales/bootstrap-datetimepicker.hu
//= require dataTables/jquery.dataTables
//= require dataTables/bootstrap/3/jquery.dataTables.bootstrap
//= require jquery_nested_form
//= require bootstrap-select
//= require bootstrap/alert
//= require bootstrap/dropdown
//= require turbolinks

我有一个客户模型,其中包含以下_form.html.erb部分：

<%= simple_form_for(@customer,html: { class: 'form-horizontal' },wrapper: :horizontal_form,wrapper_mappings: {
    check_Boxes: :horizontal_radio_and_checkBoxes,radio_buttons: :horizontal_radio_and_checkBoxes,file: :horizontal_file_input,boolean: :horizontal_boolean
 }) do |f| %>
<%= f.error_notification %>
required: true %>
    <%= f.input :name,required: true %>
    <%= f.input :location,required: true,:collection => LookupValue.joins(:lookup).where(lookups: { :name => 'Location' }).order(name: :asc).pluck(:name),:include_blank => false,input_html: { class: 'selectpicker' } %>
        <%= f.input :service_level,:collection => LookupValue.joins(:lookup).where(lookups: { :name => 'Service level' }).order(name: :asc).pluck(:name),input_html: { class: 'selectpicker' } %>
        <%= f.input :golive_date,:as => :date_picker %>
        <%= f.input :connection_type,:collection => LookupValue.joins(:lookup).where(lookups: { :name => 'Connection type' }).order(name: :asc).pluck(:name),input_html: { class: 'selectpicker' } %>
        <%= f.input :service_centre,:collection => LookupValue.joins(:lookup).where(lookups: { :name => 'Service centre' }).order(name: :asc).pluck(:name),input_html: { class: 'selectpicker' } %>
        <%= f.input :end_date,:as => :date_picker %>
        <%= f.input :sla,:collection => LookupValue.joins(:lookup).where(lookups: { :name => 'SLA' }).order(name: :asc).pluck(:name),input_html: { class: 'selectpicker' } %>
        <%= f.input :project_code %>


我的customer.js.coffee脚本文件是：

# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/

jQuery ->
  $('#customers').dataTable
    sPaginationType: "full_numbers"
    bProcessing: true
    bServerSide: true
    sAjaxSource: $('#customers').data('source')
    idisplayLength: 200
    oLanguage:
      sLengthMenu: "display 

当我直接加载客户编辑页面或使用浏览器刷新按钮刷新页面时,分配了“selectpicker”类的字段会选择bootstrap-select-rails gem格式的选择字段并应用更新后的外观和感觉. bootstrap-select-rails选择(这是正确的行为).但是,如果我在客户模型页面中的任何位置选择rails链接,然后返回到客户编辑页面,则表单将在没有来自bootstrap-select-rails gem的增强选择字段的情况下呈现,而是显示正常的默认引导选择字段.
如果我再次使用浏览器按钮重新加载页面,则会正确加载增强的选择字段.
问题我已经安装了turbolinks和jQuery.turbolinks并且application.js清单文件已经以正确的顺序加载了所有正确的引用我很困惑为什么jquery.turbolinks没有处理在页面加载时加载javascript和页面自动更改？它似乎只是在初始页面加载(或浏览器刷新),任何rails页面更改不会重新加载JavaScript.


最佳答案
我不知道你是否找到了问题的解决方案.我在目前正在处理的项目上遇到了同样的问题,我发现在我的javascript控制器文件中添加此代码似乎可以解决问题：

$(document).on('page:load',function(){
    $('.selectpicker').selectpicker();
});



                
                                原文地址：https://www.jb51.cc/jquery/427978.html
                                 版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

rails jquery.turbolinks javascript在页面更改后没有触发

相关推荐