We build. You grow.

Get best community software here

Start a social network, a fan-site, an education project with oxwall - free opensource community software

Get started

[solved] Add jquery-ui slider ui element to OXWALL component | Forum

Topic location: Forum home » Development » Custom Code Modifications

Tobias Heinz Apr 29 '13

Dear All,

I am trying to use a jQuery UI Slider UI Element in my custom plugin.
(See http://jqueryui.com/slider/)

My html view component has
<div id="slider"></div>

my controller has:

$script=
        '    $(document).ready(function(){ $( "#slider" ).slider(); });
        ';

        OW::getDocument()->addOnloadScript($script);

Watching the rendered page with firebug, I see that all the jquery UI stuff has been added the div

<div id="sliderl" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all">

</div>

But still the slider is not showing on the page. What am I missing?

If I add <div id="slider">-</div> I can even see the value for "style="left: xxx%;" changing when clicking and dragging. But the slider is invisible.

The Forum post is edited by Tobias Heinz Apr 30 '13

Tobias Heinz Apr 30 '13

[Solved]

While jquery and jquery ui js Files get added by oxwall, the jquery-ui css file does not.

I added it to my custom plugin css (static) and included in init.php of my custom plugin:

function customplugin_add_css( OW_Event $e )
{
OW::getDocument()->addStyleSheet(OW::getPluginManager()->getPlugin('customplugin')->getStaticCssUrl() . 'handy.css');
}
OW::getEventManager()->bind(OW_EventManager::ON_BEFORE_DOCUMENT_RENDER, 'customplugin_add_css');

This solved the problem.

Best regards
Tobias

Oxwall Software

Please sign in

We build. You grow.

Start a social network, a fan-site, an education project with oxwall - free opensource community software

[solved] Add jquery-ui slider ui element to OXWALL component | Forum