window not displaying properly - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: display, jquery dialog, jqxwindow, window

This topic contains 5 replies, has 3 voices, and was last updated by Peter Stoev 11 years, 11 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)

Author

window not displaying properly Posts
March 31, 2012 at 4:43 pm window not displaying properly #3144

edhrx
Participant

Just starting to learn the api

$(“#dialog1”).jqxWindow({ height:400, width: 600,isModal:true, theme:’classic’});

when displayed we get the screen overlay. I would then expect to see the window but nothing visible except the X of the close button

firebug is giving a file not found imaglass.png. I don’t know if this is part of the problem. However, checked the download it’s not in there.

Ed.

March 31, 2012 at 5:35 pm window not displaying properly #3145
Peter Stoev
Keymaster
Hi Ed,

I am not sure what could be the issue. Could you paste the code which demonstrates the behavior which you experienced?

I prepared a simple web page with a Modal Dialog which works on my side. Here’s the full source code:
```
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.classic.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxwindow.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#ok').jqxButton({ theme: 'classic', height: '25px', width: '65px' });
            $('#window').jqxWindow({ height: 145, width: 270,
                theme: 'classic', resizable: false, isModal: true, modalOpacity: 0.3,
                okButton: $('#ok')
            });
        });
    </script>
</head>
<body class='default'>
    <div id="window">
        <div>
            Modal Window</div>
        <div>
            <div>
                Please click "OK", "Cancel" or the close button to close the modal window. The dialog
                result will be displayed in the events log.
            </div>
            <div>
                <div style="float: right; margin-top: 15px;">
                    <input type="button" id="ok" value="OK" style="margin-right: 10px" />
                </div>
            </div>
        </div>
    </div>
</body>
</html>
```
Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com
March 31, 2012 at 6:43 pm window not displaying properly #3146

edhrx
Participant

Peter your dialog works great.
I wanted mine ‘on demand’ as it will be a data entry form

It’s now fixed. I added autoOpen:false then used the ‘show’ method. Works fine now.
$(“#dialog1”).jqxWindow({ height:400, width: 600,isModal:true, theme:’classic’, autoOpen:false});
$(‘#dialog1’).jqxWindow(‘show’);

AMOI I intend to use a jquery ‘theme roller’ theme for some parts of the application. Could this cause any issues ?

Ed.

April 1, 2012 at 8:09 am window not displaying properly #3147

Peter Stoev
Keymaster

Hi Ed,

According to me, there should not be any compatibility issue with using the theme roller with jQuery UI and jQWidgets in one application. However, please feel free to contact us, if you need assistance.

Best Wishes,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

October 5, 2012 at 12:22 am window not displaying properly #8947

timo75
Participant

Is there a way to set the actual Content (“Please click […] events log.”) using setContent but keep the OK-Button? When I use setContent it overwrites everything in the 2nd div of #window, including the markup for the OK-button…

What’s best practice to have Ok-buttons but set the text in the window dynamically?

October 5, 2012 at 10:02 am window not displaying properly #8971

Peter Stoev
Keymaster

Hi timo75.

setContent overrides the window’s content and that is by design. The Ok/Cancel buttons are also part of the content and its normal the setContent function call to override them, too. Another way of adding a content is to set ID of the jqxWindow’s content area and use jQuery to append/remove elements. However, the window will not be auto-resized based on your new content.

Best Wishes,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com
Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.