ons-alert-dialog doesn't work

[iriekun]

hello! i tried using dialog and found out that ons-alert-dialog doesn’t work at all. Only ons-dialog is working fine. <ons-alert-dialog> shows the empty dialog like in photo below.

<ons-page id="dialog.html">
  <ons-alert-dialog id="dialog-1">
  <div style="text-align: center; padding: 10px;">
    <p>
      This is a dialog.
    <p>

    <p>
      <ons-button onclick="hideDialog('dialog-1')">Close</ons-button>
    </p>
  </div>
</ons-alert-dialog>
</ons-page>

[munsterlander]

@iriekun Move your alert-dialog outside of your ons-page - that will solve your issue. Here are some excellent examples: http://tutorial.onsen.io/?framework=vanilla&category=Reference&module=dialog

[iriekun]

Although I put it outside <ons-page> it still doesn’t show anything! just an empty dialog like above photo

[munsterlander]

@iriekun What platform? Any additional frameworks or plugins? Can you post more of your code or make a codepen?

Edit: Can you run this codepen and let me know what happens? https://codepen.io/anon/pen/eBdPRV

[iriekun]

for both iOS and android and no additional framework. The code work with codepen but not with my project. Btw I use cloud monaca
https://codepen.io/anon/pen/eBdPMr

[munsterlander]

Your code worked for me.

Now, I presume you meant the codepen worked for you as well but not when ran on the debugger. If so, that would indicate to me we have other problems in your code. Have you tried a stripped down project to check functionality yet?

Here it is running in debugger.