0

Datepicker container opening in random place when we place the Ngx-Bootstrap modal inside another modal. Note: Inner dailog has datepicker element.

For reference please check this demo

Update: Closing the previous modal will solve the issue but we need to maintain the state without closing the previous modal. And need to append the datepicker container to specific element

kernal_lora
  • 1,115
  • 3
  • 12
  • 25
  • Date picker calendar opens in the first modal instead of the second modal. To fix this issue you need to close first modal and then open the second modal. As suggested by @Đỗ văn Thắng – Santosh Shelke Jan 11 '21 at 07:13
  • @SantoshShelke We need to maintain the previous modal state also – kernal_lora Jan 11 '21 at 07:17

2 Answers2

1

You can close modal1 before opening modal2 in your ts file. For example:

openModal2(template: TemplateRef<any>) {
    this.modalRef.hide();
    this.modalRef2 = this.modalService.show(template, {
      animated: true,
      backdrop: "static"
    });
  }
0

container only supports "body", remove [container]="'.test'" from your code. It should work.

Santosh Shelke
  • 562
  • 2
  • 6
  • 19