Getting started with PAX

In this article, we show you how to get started with the PAX javascript framework. We show a simple example using a form, and then follow on with more complex situations.

This article discusses the following parts in detail:

Initial setup
Simple example - datepicker
Extended example - form validation
Complex example - form validation with ajax
Creating your own widgets

Initial setup

In order to get PAX running, follow these steps:

Download and uncompress PAX to the root of your webserver, the zip file contains a directory paxjs already, so you end up with http://localhost/paxjs/
Insert the pax CSS file (/pax/resource/css/pax_consolidated.css) into the head of your document.
Insert the pax development script (pax_dev.js*), as far into the body as possible, ie: just before you need to access it (for optimal performance)

* Note that you would use pax_prod.js, in a production environment, plus enable mod_deflate.
You are now ready to go! You end up with at least the following html:

    
<html>

    <head>

        <style type='text/css'>@import url( /pax/resource/css/pax_consolidated.css );</style>

    </head>

    <body>

        ... stuff ...

        <script src='/pax/pax_dev.js' type='text/javascript'></script>

        <script>

            ... your code ...

        </script>

    </body>

</html>

Read on for a simple example!