Dynamically Window Content

[woern123Member]

I am new to jqWidgets.
I have used another widget to load e.g. Popup-Windows.
But now i mess around with multiple windows and want an easier solution.

Is ist possible to load content dynamically in an jqxWindow?
Running a jqxWindow with predefined Content in the DIV is clear.

But what can i do with the ‘foobar’ or ‘Sample content’ in the commands below?
$(‘#jqxWindow’).jqxWindow({ content: ‘foobar’ });
$(‘#jqxWindow’).jqxWindow(‘setContent’, ‘Sample content’);

Can it be a URL to dynamically load content?
e.g.:
$(‘#jqxWindow’).jqxWindow({ content: ‘content.php?param=1’ });

If not, what else can i do?

[MinkoBlocked]

Hello,

you can load the content of the jqxWindow dynamically using the following function:

$(document).ready(function () {
    //Initializing the window
    $('#window').jqxWindow({ height: '130px' });
    //Make AJAX request and set window's content with the responed data
    function changeContent(url, window) {
        window.jqxWindow('setContent', 'Loading...');
        $.ajax({
            dataType: 'jsonp',
            url: url,
            success: function (data) {
                //Parsing the data if needed
                window.jqxWindow('setContent', data[0].text);
            },
            error: function () {
                window.jqxWindow('setContent', 'Error');
            }
        });
    }
    changeContent('https://api.twitter.com/1/statuses/user_timeline.json?screen_name=jqwidgets&count=1', $('#window'));
});

In the example above the content of the window will be the last tweet of jQWidgets.

First we define function which accepts as arguments url (used for getting JSONP) and specific window.
In the function we make ajax request. The success callback sets jqxWindow’s content.

Best regards,
Minko

jQWidgets Team
http://jqwidgets.com/

[zemorangoParticipant]

Hi Minko,

your code seems to be nice, but I can’t make it work :(,

Please do you have a full small sample that you can share?

Regards
José

[Peter StoevKeymaster]

Hi Jose,

We have a blog post about loading the Window’s content via Ajax. You can take a look at it here: load-jquery-window-content-with-ajax.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[paolo.macorMember]

hello,
following your directions I can load dynamic html content in jqxWindow via Ajax, but I have a strange behavior: once closed jqxWindow does not reopen when calling show or expand methods. If I use your code using dataType: ‘jsonp’ this is not happening.
It has something to do with ajax call dataType: ‘html’ but I can’t realize what can really be …
Any suggestion?
Thanks
paolo


$('#window').jqxWindow({ keyboardCloseKey: 'esc', animationType: 'fade', autoOpen: false, height: 550, width: 900, showCollapseButton: true});
$("#goReport").bind('click', function () {
$('#window').jqxWindow('setTitle', 'Report anno: '+$("#jqxDDLYEAR").jqxDropDownList('getSelectedItem').value+' mese: '+$("#jqxDDLMONTH").jqxDropDownList('getSelectedItem').value );
changeContent('report.php', $('#window'));
$('#window').jqxWindow('expand');
$('#window').jqxWindow('show');
});

function changeContent(url, window) {
window.jqxWindow('setContent', 'attendere ... generazione del report in corso ...');
$.ajax({
dataType: 'html',
url: url,
success: function (data) {
window.jqxWindow('setContent', data);
},
error: function () {
window.jqxWindow('setContent', 'Error');
}
});
}


[paolo.macorMember]

apologies … my bad (as usual!)
php generated content had references to jqxwidgets libraries, so everything got jammed
be careful if somebody gets same thing …

[Author]

Posts