Drupal Technical

How to install jQueryUI in Drupal 6

Jiby.john | | 1 min read

Have you ever wondered how that cool site you saw last day had those cool interfaces and you wished your Drupal site could have the same coolness? jQueryUI is your saviour here. jQueryUI is one of the most popular JavaScript libraries out there in the world of web development. jQueryUI allows you to add very cool user interface elements to your website without much effort.

Just follow these steps to get jQueryUI working at your command:

1. Download the drupal module for jqueryUI from: http://drupal.org/project/jquery_ui and extract the files to sites/all/modules directory.
2. Download the jQuery UI 1.6 release from: http://code.google.com/p/jquery-ui/downloads/list?q=1.6
3. Extract the files and place it in /sites/all/libraries/jquery.ui/ so that the actual jQuery UI JavaScript files are located in: /sites/all/libraries/jquery.ui/ui/*.js
4.Enable your module at Administer > Site building > Modules.
5.To use jquery ui in your module you need to call the function: 

jquery_ui_add($files);


like, 

jquery_ui_add(array('ui.dialog', 'ui.droppable', 'ui.sortable'));


when you call the above function, the corresponding js file will be loaded to that module. If everything goes well,you can create a dialog box 

jquery_ui_add('ui.dialog');

<script>
$(document).ready(function() {
$('.message').dialog();
});
</script>

<div classs="message"t>Hello</div>

Run that, and bask in the glory of your newly found jQuery expertise!
Happy coding!.

 

 

Related Topics