CODEWITHSUNDEEP
angularprimengprimeng-dialog
JonathanL
JonathanL

Reputation: 176

How can I prevent off the screen the dragging of a p-dialog from PrimeNG

I'm using p-dialog from PrimNG. With [draggable] enabled, I can prevent the modal from being dragged off-screen on the left and top using [minX] and [minY].

Is there a way to prevent the modal from being dragged off-screen on the right and bottom?

I am using https://www.primefaces.org/primeng/#/dialog in a pretty standard implementation.

Upvotes: 3

Views: 3272

Answers (3)

xom4ek
xom4ek

Reputation: 11

maybe will be useful for someone.

  <ConfirmDialog
        visible={visibleState}
        onHide={() => handleCloseModal()}
        accept={accept}
        reject={reject}
        draggable={false} // just add draggable - false
      />

Upvotes: 0

Davide
Davide

Reputation: 2124

This commit fixed your problem: https://github.com/primefaces/primeng/commit/c47b22fe3e850ca95ab36e9d99f9bf900832a682?branch=c47b22fe3e850ca95ab36e9d99f9bf900832a682&diff=split

But as I discovered, Edge is having some trouble with it when you sroll the page and then you open the modal

Upvotes: 0

Nabil Shahid
Nabil Shahid

Reputation: 1458

As '[minX]' is the minimum draggable coordinates to the left and '[minY]' is the minimum draggable coordinates to the top, set them to a large negative number i.e. [minX]="-1000" [minY]="-1000" . In this way you will be able to drag the dialog much more to the left and top.

Upvotes: 1

Related Questions