Add Material Icon inside MaterializeCss Toast?

426
June 28, 2017, at 03:10 AM

Is it possible to add an icon inside a materializecss toast message?

I tried doing it like this but got '[object-object]' returned inside the toast:

var $printerIcon = $('<i class="material-icons print"></i>');
Materialize.toast($printerIcon + 'Your print job was sent',4000);
Answer 1

The problem is, that Javascript tries to convert $printerIcon + 'Your print job was sent' to a string.

Try adding the text inside the markup like so:

const printerIcon = '<i class="material-icons print"></i>';
const toastMessage = 'Your print job was sent';
const $toastContent = $( `${ printerIcon } ${ toastMessage }` );
Materialize.toast( $toastContent, 4000 );
Rent Charter Buses Company
READ ALSO
Stop floating div before a specific div (universal)

Stop floating div before a specific div (universal)

I am trying to make a div float and then stop before a specific div (in this case; the footer), it works on my screen, but when trying in a larger screen, the floating div is a little higher

236
Iframe exceeds a div in a parent web page

Iframe exceeds a div in a parent web page

I am embedding an video in a parent website where the iframe is a bit longer than the div

332
Expand/collapse multiple bootstrap table rows

Expand/collapse multiple bootstrap table rows

I have a Bootstrap table that shows three rows of data plus a header row by defaultRow 5 has a button that says "more

552