Skip to content

DragDropModule : Limit the draggable element stay in the bounds (of a container) #14211

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
sdechatillon opened this issue Nov 20, 2018 · 1 comment · Fixed by #14242
Closed

DragDropModule : Limit the draggable element stay in the bounds (of a container) #14211

sdechatillon opened this issue Nov 20, 2018 · 1 comment · Fixed by #14242
Assignees
@crisbeto
Labels
feature This issue represents a new feature or feature request rather than a bug or bug fix P4 A relatively minor issue that is not relevant to core functions

Comments

@sdechatillon
Copy link

sdechatillon commented Nov 20, 2018 •
edited
Loading

Bug, feature request, or proposal:

Feature request : Give the possibility to set a container as bounds.

What is the expected behavior?

The draggable element cannot be out of the bounds, even visually. It always stays inside the container and can be dropped everywhere inside the container.
( As in angular-draggable : https://xieziyu.github.io/angular2-draggable/#/draggable/usage/boundary )

What is the current behavior?

No such behavior

What are the steps to reproduce?

What is the use-case or motivation for changing an existing behavior?

My draggable element is a modal window. We should be able to move the modal, but force it to stay inside the "body" container (for example).

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular Material 7

Is there anything else we should know?
@sdechatillon sdechatillon changed the title Limit the draggable element stay in the bounds (of a container) DragDropModule : Limit the draggable element stay in the bounds (of a container) Nov 20, 2018
@josephperrott josephperrott added feature This issue represents a new feature or feature request rather than a bug or bug fix P4 A relatively minor issue that is not relevant to core functions labels Nov 20, 2018
@crisbeto crisbeto self-assigned this Nov 20, 2018
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 22, 2018
@crisbeto
feat(drag-drop): add the ability to constrain to an element
8aa7719 
Adds the `cdkDragBoundry` input that allow for people to constrain the dragging of an element to another element.

Fixes angular#14211.
@crisbeto crisbeto mentioned this issue Nov 22, 2018
Merged
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 22, 2018
@crisbeto
feat(drag-drop): add the ability to constrain dragging to an element

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode
aa7b826 
Adds the `cdkDragBoundry` input that allow for people to constrain the dragging of an element to another element.

Fixes angular#14211.
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 23, 2018
@crisbeto
feat(drag-drop): add the ability to constrain dragging to an element
3900385 
Adds the `cdkDragBoundary` input that allows for people to constrain the dragging of an element to another element.

Fixes angular#14211.
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 23, 2018
@crisbeto
feat(drag-drop): add the ability to constrain dragging to an element

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode
40d2540 
Adds the `cdkDragBoundary` input that allows for people to constrain the dragging of an element to another element.

Fixes angular#14211.
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 30, 2018
@crisbeto
feat(drag-drop): add the ability to constrain dragging to an element
e976add 
Adds the `cdkDragBoundary` input that allows for people to constrain the dragging of an element to another element.

Fixes angular#14211.
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 30, 2018
@crisbeto
feat(drag-drop): add the ability to constrain dragging to an element
6574c2f 
Adds the `cdkDragBoundary` input that allows for people to constrain the dragging of an element to another element.

Fixes angular#14211.
mmalerba pushed a commit that referenced this issue Dec 3, 2018
@crisbeto @mmalerba
feat(drag-drop): add the ability to constrain dragging to an element (#…
8432e80 
…14242)

Adds the `cdkDragBoundary` input that allows for people to constrain the dragging of an element to another element.

Fixes #14211.
josephperrott pushed a commit to josephperrott/components that referenced this issue Jan 14, 2019
@crisbeto @josephperrott
feat(drag-drop): add the ability to constrain dragging to an element (a…
5dfe02e 
…ngular#14242)

Adds the `cdkDragBoundary` input that allows for people to constrain the dragging of an element to another element.

Fixes angular#14211.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 10, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@crisbeto crisbeto

Labels
feature This issue represents a new feature or feature request rather than a bug or bug fix P4 A relatively minor issue that is not relevant to core functions
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

feat(drag-drop): add the ability to constrain dragging to an element crisbeto/material2
3 participants
@crisbeto @josephperrott @sdechatillon