layout issues for simple confirmation popup.

[alexnParticipant]

Hi, I’d like to create a simple confirmation poupup using jqxWindow.

The problem is that when I invoke ‘setContent’, the OK and CANCEL button are removed from the DOM.

Alternatively, instead of using setContent, I tried using jquery’s text() method. Unfortunately, this would clip the OK & CANCEL buttons in the layout.

What’s the best way to programmatically inject text content for a confirmation popup?

My demo: https://plnkr.co/edit/nGuvaUkqaVDLzpRdkCiQ?p=preview

[alexnParticipant]

Hello, I’d like to display a jqxwindow – but without a title section at the top.

There does not appear to be a property that turns the title off, so I tried:

$(‘.jqx-window-header’).css(‘display’, ‘none’);

This works in removing the title section, but as a result the layout is incorrect: It appears that the overall height of the popup is not recalculated and redrawn. What’s the best way to handle this situation?

My demo: https://plnkr.co/edit/XLx9POPSGJM1Tpd6vOcw?p=preview

[HristoParticipant]

Hello alexn,

You could use another jqxWindow “for a confirmation popup”.
If you want to add additional information in the Window content to use a (<div/>) container. (as your approach)
Another option if you want to have ‘Ok’ and ‘Cancel’ buttons just could set them in the other container and just switch between .show() and .hide();

About the second question – window “without a title section”.
Please, take a look at this topic:
http://www.jqwidgets.com/community/topic/headerless-jqxwindows/#post-63684

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[alexnParticipant]

(My apologies for making posting 2 questions at once. That was inadvertent.)

Regarding the second question: window “without a title section”…

The link you referenced indicates that the solution is to change the jqx-window-header & jqx-widget-header classes to “display:none”.
As you can see in the demo below, this still leaves problems in the layout. It leaves extra room at the bottom of the window. Is there a way to resize the window to the proper height after the title section is removed?

https://plnkr.co/edit/5tT0yiK1RPfZZEVLKWgU?p=preview

[HristoParticipant]

Hello alexn,

You could try to set height to “100%” for the Window content: $('.jqx-window-content').css('height', '100%');.
Also, you could try to set height property of the Window with own calculations.

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts