gal007
gal007

Reputation: 7202

Adding Jquery UI to XSLTForms

I was trying to add JQuery UI functionality and styling but I'm having problems with the CSS file. I use to attach a lot of libraries to XSLTForms files, but I really can't make it load. I already put the and tags inside the CSS file, as I use to do with other CSS files, but with no success.

Any idea what could be wrong? Functionality is OK, because Y can make it appear a dialog, but with no style. I copied the source code in a new file and change it to html (replacing the XForms tahgs with HTML ones) and everything worked ok. So I think there is something with XSLTForms.

<xf:trigger id="showDialog">
    <xf:label>Show dialog!</xf:label>
    <xf:load ev:event="DOMActivate" resource="javascript: 

        var dialog = document.createElement('div');
        dialog.innerHTML = 'Your modal dialog';

        $(dialog).dialog({
            autoOpen: true,
            modal: true,
            title: 'Attention',
            open: function(){
                $('.ui-widget-overlay').bind('click',function(){
                    $(dialog).dialog('close');
                })
            }
        });
    "/>
</xf:trigger> 

I also unsuccessfully tryed to load this way:

<style type="text/css">
    @import url('res/jquery-ui.css');
</style>

Upvotes: 1

Views: 243

Answers (2)

Bill Velasquez
Bill Velasquez

Reputation: 893

XSLTForms requires CSS files to be XML Well-formed.

This option can be disabled including this processing instruction in your XForms:

<?css-conversion no?>

Take a look to this XSLTForms Wikibook article

Upvotes: 2

gal007
gal007

Reputation: 7202

This particular file had something than others don't: CSS comments. Just remove comments or make it as in the XML way (<!-- A comment! -->).

But for some reason, any image referenced is not loaded...

Upvotes: 0

Related Questions