Materialize Dropdown

Testing materialize dropdown

by mozfet

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css">
<div class="container">
  <div class="row">
    <!-- Dropdown Trigger -->
    <a class='btn' href='#' data-target='dropdown1'>Drop Me!</a>

    <!-- Dropdown Structure -->
    <ul id='dropdown1' class='dropdown-content'>
      <li><a href="#!">one</a></li>
      <li><a href="#!">two</a></li>
      <li><a href="#!">three</a></li>
    </ul>
  </div>
</div>

JavaScript

// on document ready
$(function() {  
  const buttonQuery = $('.btn')
  const buttonElement = buttonQuery.get()
  M.Dropdown.init(buttonQuery, {coverTrigger: false})
  const dropdownInstance = M.Dropdown.getInstance(buttonQuery)
  console.log(dropdownInstance)  
  buttonQuery.click(() => {
    console.log('click')
    //dropdownInstance.open()
  })
})