help(Drang and Drop): [Drag and Drop Angular Material is not working good with Dialog Material] #19197
Description
What are you trying to do?
I'm trying to Drag and Drop my image list that sometimes works and sometimes doesn't.
What troubleshooting steps have you tried?
I have a Dialog Material that is open when the user clicks and inside I have a Mat-Tab that when the user clicks the change for the component that I have a list of images that has a Drag and Drop for order propose and sometimes work and some doesn't and I don't know why.
Reproduction
It is too much job to make a reproduction of this because is a large application but I can put my codes here:
openProductDialog(rowChoosed) {
const objTemp = { name: 'Editar Produto', objData: rowChoosed };
this.dialog.open(DialogFormUpdateProductComponent, {
panelClass: 'custom-dialog-product-mp',
width: '920px',
height: 'auto',
maxHeight: '800px',
data: objTemp,
});
this.updateState();
}
And when the object is clicked a modal like this is open:
When the modal is open, the modal has an Image tab like in the picture and when this is clicked it shows my upload image that is like this:
In the tab, I put a component that starts that feature
<mat-tab label="Imagens">
<app-upload-img></app-upload-img>
</mat-tab>
The problem is sometimes I open my modal and simply can't drag and drop, sometimes I can sometimes I don't.
So I don't know what looking to resolve my problem. Strange behavior I detected is that I have a lightbox when I click the image, so I know when I cannot drag in drop the images when my lightbox stays like this:
The image simple jump to the top of the page and when this happens I can't drag in drop the images, I think is some CSS problem.
I see this thread #15880
and when I put this in CSS
html.cdk-global-scrollblock {
position: initial !important;
}
html.cdk-global-scrollblock body {
position: fixed;
}
it worked but break my website
Environment
- Angular: 9.1.2
- CDK/Material: 9.2.1
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Windows 10