Wijmo 5 - popup modal and flexgrid

Wijmo 5 - popup modal and flexgrid

Posted by: feniksreborn on 2 February 2018, 9:26 pm EST

• 

  feniksreborn

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 2 February 2018, 9:26 pm EST

  Hello,

  I am using Angular 5 and TypeScript with Wijmo 5.
  
  I need to use popup modal control in combination with the FlexGrid control and side menu.
  
  I have managed to organize everything but I have a problem with flex grid. The Flex Grid is always out of modal.

  Somehow CSS class “modal-body” is not wrapping the flex grid control???
  
  Can you suggest some solution or idea what is happening?

  Do you have some example how to use simple side menu with buttons and flex grid control in the modal window?

  Thank you.

• 

  feniksreborn

  • Post Options:
  • Link
    Copy

  Posted 3 February 2018, 8:19 am EST

  I have made a plunker example:

  http://plnkr.co/edit/wUixWy3gtxLzktZR5u7t?p=preview

  Please try to resize window of the plunker.
  
  How to have modal with fix size and not loose responsive behavior?

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 4 February 2018, 7:58 pm EST

  Hi,
  
  We are sorry, we are unable to replicate the issue at our end. Please refer to the updated plunker with some CSS change and screenshot.

  http://plnkr.co/edit/YWSUZWAw9fkzqZpoOLey?p=preview

  ~Manish

• 

  feniksreborn

  • Post Options:
  • Link
    Copy

  Posted 8 February 2018, 6:13 pm EST

  Hello,

  I have replicated right away. Just try to resize the right side of the plunker window.

  Best regards,
  
  M

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 11 February 2018, 3:42 pm EST

  Hi,

  I am not sure I understand. As per your first query the FlexGrid is out of the Modal Window and you wanted that fixed. But in the sample(plunkr) provided, FlexGrid seems to be inside the Modal Window. Could you please elaborate your requirement so that we can help you accordingly.

• 

  feniksreborn

  • Post Options:
  • Link
    Copy

  Posted 11 February 2018, 7:11 pm EST

  Yes, sorry about the misunderstanding.

  The Flex Grid is indeed in modal, but it’s overlapping with side menu.
  
  This should be responsive, if I use correct classes.

  Best regards,
  
  M

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 11 February 2018, 7:34 pm EST

  Hi,

  Could you please try setting the Width of the PopUp Modal and let me know if helps. I was able to fix it by setting the Width of PopUp Modal to 600px

  <wj-popup class="col-md-6  modal-content wj-control wj-content wj-popup" 
  tabindex="-1" [modal]="true" [hideTrigger]="'None'"
      #modalcategory style="width:600px;">
  

• 

  feniksreborn

  • Post Options:
  • Link
    Copy

  Posted 11 February 2018, 11:08 pm EST

  Hi.

  I forked plunker http://plnkr.co/edit/knq0mMye6HbfTkVvCzs5?p=preview
  
  It is the same as before if we have a longer button title it’s still overlapping with side menu.

  Any suggestion?

  Thank you.

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 12 February 2018, 2:15 pm EST

  Hi,

  I have made the changes here. Please check the plunker out

  http://plnkr.co/edit/xl0uA4xVHo3yAEooP88Y?p=preview

• 

  feniksreborn

  • Post Options:
  • Link
    Copy

  Posted 13 February 2018, 10:24 pm EST

  Hi,

  I am getting 404 Page Not Found on your plunker link.

  Best regards,
  
  M

• 

  abhishek.dutta

  

  • Post Options:
  • Link
    Copy

  Posted 14 February 2018, 2:40 pm EST

  http://plnkr.co/edit/xl0uA4xVHo3yAEooP88Y?p=preview

  Please try this again