直接使用toastr这个js插件,而不要使用toastr-rails这个gem,如果使用这个gem,那么在view中设置toastr将会无效,appication.js中对toastr的设置将对view中的toastr显示无效。

#直接在安装toastr这个插件,github地址:https://github.com/CodeSeven/toastr
<head>
  <link rel="stylesheet" media="all" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
</head>

#toastr的设置链接地址为https://codeseven.github.io/toastr/demo.html

#application.js, 这会对js文件内容有效
$(document).ready(function() {
  toastr.options = {
    "closeButton": false,
    "debug": false,
    "newestOnTop": false,
    "progressBar": false,
    "positionClass": "toast-top-center",
    "preventDuplicates": false,
    "onclick": null,
    "showDuration": "100",
    "hideDuration": "1000",
    "timeOut": "1000",
    "extendedTimeOut": "1000",
    "showEasing": "swing",
    "hideEasing": "linear",
    "showMethod": "fadeIn",
    "hideMethod": "fadeOut"
  }
})

#_flash_messages.html.erb的内容,这会对controller中flash的设置有效
<% unless flash.empty? %>
  <script type="text/javascript">
    <% flash.each do |type, message| %>
      <% type = type.to_s.gsub('danger', 'error').gsub('success', 'success') %>
      toastr['<%= type %>']('<%= message %>', '',
          {"closeButton": false,
           "debug": false,
           "newestOnTop": false,
           "progressBar": false,
           "positionClass": "toast-top-center",
           "preventDuplicates": false,
           "onclick": null,
           "showDuration": "100",
           "hideDuration": "1000",
           "timeOut": "1000",
           "extendedTimeOut": "1000",
           "showEasing": "swing",
           "hideEasing": "linear",
           "showMethod": "fadeIn" });
    <% end %>
  </script>
<% end %>

results matching ""

    No results matching ""