Is there a way to create a scrollable dialog in onsen

Question

Is there a way to create a scrollable dialog in onsen?

problematic code: https://codepen.io/anon/pen/pWaQwB

<ons-page>
  <ons-list>
    <ons-list-item tappable onclick="document.getElementById('dialog-1').show()">Simple dialog</ons-list-item>
      </ons-list>
</ons-page>

<ons-dialog id="dialog-1">
  <div style="text-align: center; padding: 10px;">
    <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
      This is a dialog.
      <p>
        <p>
          <ons-button onclick="document.getElementById('dialog-1').hide()">Close</ons-button>
        </p>
  </div>
</ons-dialog>

score 1 · Answer 1 · answered Oct 13 '17 at 11:43

What if you set a fixed height to the div and add overflow-y: auto ? For an instance,

<div style="text-align: center; padding: 10px; overflow-y: auto; height: 200px;">
    <p>
        This is a dialog.
    </p>
    <p>
        whatever the content you want
    </p>
</div>

Is there a way to create a scrollable dialog in onsen

1 Answers1