0

So I'm making this web control panel but I'm not good with JS. I'm using MaterializeCSS + HTML + PHP for the DB login and so on.

I would like to have the following simple functionality but for some reason I'm failing.

I'd like to fill in the username and password in my form and press Log in. Since I'm not sure how Toasts work, I suppose once I switch the page the Toast actually disappears so maybe it's better to display the toast in the new Account page that opens instead of the Login page itself. I tried both but it doesn't appear.

Code to show Toast:

echo "<script> Materialize.toast('Login successful!', 3000, 'rounded')   </script>";

I found a topic somewhere in Russian saying this has a problem with DOM and used its solution without success again.

Note: I already use other JS-dependent components such as Modals and Tooltips.

Console error: Uncaught ReferenceError: Materialize is not defined

iBobb
  • 1,140
  • 1
  • 14
  • 35

3 Answers3

1

I had 2 problems. Most importantly, I was testing the code in an IF that wasn't even executed. Stupid me. Secondly, I wasn't using onDocumentReady - $(function(){});

The document referrer is just to check which page sent me there but here's my working code to create a MaterializeCSS Toast from PHP:

echo "
<script>
$(function(){
   if (document.referrer == 'http://yourdomain/index.php?p=Login'){
    Materialize.toast('Login successful', 2200, 'rounded')
}
});  
</script>";
iBobb
  • 1,140
  • 1
  • 14
  • 35
1

I had the same problem with one of my PHP scripts. In the end after a lot of research I found that I had not included JQuery. Materialize CSS needs JQuery loaded before materialize.js file. Make sure that jquery is loaded. The console error shows up because JQuery is not loaded.

I tested this code on my localhost without jquery toast doesn't work but when loaded it works fine.

<?php 
    if (isset($_GET['msg'])){
      $msg = $_GET['msg'];
      echo "<script>Materialize.toast('$msg', 3000, 'rounded');</script>"; 
    }
  ?>
Deepak G
  • 11
  • 3
0

you can put your if condition in php like this

<?php
    `if (document.referrer == 'http://yourdomain/index.php?p=Login')
     {
      echo "
      <script>
        Materialize.toast('Login successful', 2200, 'rounded');
      </script>";
    }`
?>