0

I have a button that I want to open the mdl-layout__drawer. For example, see the official example here and note the menu icon opens the drawer upon clicking.

I have a button that, upon clicking, I want the drawer to open. I have tried both of the jQuery selectors below with the jQuery.click() method. Neither works - only a screen flicker. Any ideas?

$(".mdl-layout__drawer-button").click();
$(".material-icons:contains('menu')").click();
Ronnie Royston
  • 16,778
  • 6
  • 77
  • 91
  • Any chance you could share a codepen where the issue is visible? There is a number of things that could be going wrong, so it's hard to tell without more code to look at. – Sérgio Gomes Sep 22 '15 at 11:42
  • [Codepen here](http://codepen.io/rhroyston/pen/epzwOO) Ummm, ...well, it works on Codepen! Hmmm... – Ronnie Royston Sep 22 '15 at 18:26
  • It could be a problem with loading jQuery, in that case. Sadly, I'm not an expert there, so I don't think I'll be able to help further without a failing example :-/ – Sérgio Gomes Sep 23 '15 at 09:30

2 Answers2

0

Make sure your code is inside $(document).on('pageinit') and you are using the correct selector to detect the button click like in the example below:

$(document).on('pageinit', function() {
        $("#idOfTheButton").click(function() {
            $(".mdl-layout__drawer-button").click();
    }); 
});
Atahan Acar
  • 502
  • 3
  • 10
0

No need to click the menu button, toggle sidenav visibility with material API document.querySelector('.mdl-layout').MaterialLayout.toggleDrawer();

Ivan Proskuryakov
  • 1,625
  • 2
  • 23
  • 32