PacktLib: Moodle JavaScript Cookbook

Moodle JavaScript Cookbook


About the Author

About the Reviewers


Combining Moodle and JavaScript


Creating a new Moodle PHP page

Loading a JavaScript file

Loading a JavaScript file in

Generating a JavaScript function call from PHP

Passing variables from PHP to JavaScript

Ensuring compliance with XHTML Strict

Retrieving language strings from Moodle

Moodle and Yahoo! User Interface Library (YUI)


Initializing the YUI 3 library

Loading additional YUI modules

Loading YUI 2 modules from YUI 3

Attaching basic event handlers

Attaching advanced DOM event handlers

Implementing event delegation

Debugging with the YUI console

Moodle Forms Validation


Adding a required field

Adding a field with a maximum length

Adding a field with a minimum length

Adding a field length within in a specified range

Adding a valid e-mail address field

Adding custom validation with a Regular Expression

Adding a field that accepts only alphabetic characters

Adding a field that accepts only alphanumeric characters

Adding a field that accepts only numeric characters

Rejecting punctuation characters

Rejecting input without a leading zero

Comparing with another field

Adding a custom JavaScript validation function callback

Manipulating Data with YUI 3


Using IO to request a URI

Using IO's alternative transport method for requesting external URIs

Using PHP as a proxy to load data from an external domain

Parsing XML with DataSource

Parsing JSON with DataSource

Working with Data Tables


Initializing a YUI DataSource

Displaying data

Basic column sorting

Adding paging

Enabling scrolling

Enabling editing

Enhancing Page Elements


Adding a text box with auto-complete

Adding a combo box with auto-complete

Displaying auto-updating data

Enabling resizable elements

Adding custom tooltips

Adding custom button controls

Advanced Layout Techniques


Adding a fly-out navigation menu

Adding a drop-down navigation menu

Displaying a tree-view navigation menu

Animating Components


Fading in an element

Fading out an element

Scrolling an element

Resizing an element

Animating with easing

Moving an element along a straight path

Moving an element along a curved path

Changing an element's color

Sequencing multiple animations

Integrating External Libraries


Adding the jQuery framework

Adding the MooTools framework

Adding the Dojo framework

Adding the Prototype framework

Adding the add-on to Prototype

Adding image enlargement with Lightbox 2