Skip to content
This repository has been archived by the owner on Mar 4, 2021. It is now read-only.

How To add jQueryUI to a Plugin Page

tjlytle edited this page Apr 9, 2011 · 3 revisions

Note: This method worked for jQuery's datepicker, other UI elements have not been tested.

###Download the needed jQueryUI libraries. Use the 1.7.3 version, OpenVBX already has that core. ###Extract the specific file(s) needed to your plugin directory. To use the daatepicker, extract /development-bundle/ui/ui.datepicker.js to your plugin directory. ###Extract the theme(s) needed to your plugin directory. To use ui-lightness, extract the contents of /development-bundle/themes/ui-lightness/ to your plugin directory. ###Include the jQuery files. In the plugin page script:

   <?php
   OpenVBX::addJS('ui.datepicker.js');

###Include the theme using jQuery:

There may be a better way that this, but to add the necessary stylesheet, first determine the asset path for the plugin by checking the included jQueryUI script, then append the stylesheet.

   //find the correct asset path for the plugin
   var assetPath = $('script[src*="ui.datepicker.js"]').attr('src').replace('/ui.datepicker.js', '');
   //add date picker css
   $('head').append('<link rel="stylesheet" href="'+assetPath+'/jquery-ui-1.7.3.custom.css" type="text/css" />');
Clone this wiki locally