Source library: https://github.com/CodeSeven/toastr
Installation:
console:
yarn add toastr
Import toastr in app/javascripts/packs/application.js:
global.toastr = require("toastr")
app/javascript/stylesheets/application.scss:
@import 'toastr'
app/javascript/packs/application.js:
import "../stylesheets/application"
app/views/layouts/application.rb:
<% unless flash.empty? %>
<script type="text/javascript">
<% flash.each do |f| %>
<% type = f[0].to_s.gsub('alert', 'error').gsub('notice', 'info') %>
toastr['<%= type %>']('<%= f[1] %>');
<% end %>
</script>
<% end %>
customizing the flash:
<% unless flash.empty? %>
<script type="text/javascript">
<% flash.each do |f| %>
<% type = f[0].to_s.gsub('alert', 'error').gsub('notice', 'info') %>
toastr['<%= type %>']('<%= f[1] %>', '', {
"closeButton": true,
"positionClass": "toast-top-center",
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "5000",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"progressBar": true,
"hideMethod": "fadeOut" });
<% end %>
</script>
<% end %>
Footnote: require("stylesheets/application.scss")
= import "../stylesheets/application"
Top comments (4)
I like your post because they are clear and concise 😄 I didn't know toastr, Thanks!!!
hello, thanks for your post.
please how do i use this in rails 7
Amazing one dude!
I am your fan, learn a lot from your course udemy.