jQuery4PHP Current Release: v1.7.0 - Stable

jQuery version: v1.8.2

jQueryUI version: Stable (1.8.24: jQuery 1.3.2+)

jQuery4php API

jQuery4PHP

Hide navigator Hide source code

Introduction

jQuery4PHP ( jQuery for PHP ) is a PHP 5 library. Makes easy writing javascript code (jQuery syntax) using PHP objects. Develops Rich Internet Applications in an easy way without having to know javascript language with the help and power of jQuery.

Using autoload:

To use the library jQuery4PHP you should load all necessary classes for it to work. jQuery4PHP fortunately provides the option to autoload.

<?php
include_once 'path/to/YepSua/Labs/RIA/jQuery4PHP/YsJQueryAutoloader.php';
YsJQueryAutoloader::register();
?>

Include the jQuery library
<head>
  <script type="text/javascript" src="path/to/jquery.min.js"></script>
</head>

And presto!!!.

The class 'YsJQuery':

This class provides all (or almost all) the functionality of the jQuery project, Using static methods for build jquery sintax.

A basic example

To display a message 'alert("Hello World")' in your browser when you click a button, you use this jquery sintax:

$('#buttonId').click(function(){
  alert('Hello world');
});

In jQuery4PHP, you should write in this way

<?php
echo 
YsJQuery::newInstance()
  ->onClick()
  ->in('#buttonId')
  ->execute('alert("Hello World")')
?>

If you don't want to use the echo constructor, you can call the 'write()' method of the YsJQuery object. Anyway echo is recommended.

<?php
YsJQuery::newInstance()
  ->onClick()
  ->in('#buttonId')
  ->execute('alert("Hello World")')
  ->write()
?>




Another way to set an event (static method)


<?php
echo
YsJQuery::click()
  ->in('#btnClick')
  ->handler('alert("Hello World")')
  ->execute()
?>

This code return the next sintax:

jQuery('#btnClick').click(function(){alert("Hello World")})


Add the click event when button is ready


<?php
echo
YsJQuery::click()
  ->in('#btnClick')
  ->handler('alert("Hello World")')
  ->executeOnReady()
?>

This code return the next sintax:

jQuery('#btnClick').ready(function(){jQuery('#btnClick').click(function(){alert("Hello World")})})

A basic animation

You can see the jquery sintax for this example here.

Now with jQuery4PHP:

<button id="go1">&raquo; Animate Block1</button>
<button id="go2">&raquo; Animate Block1</button>
<button id="go3">&raquo; Animate Both</button>

<button id="go4">&raquo; Reset</button>
<div class="block_animate" id="block1">Block1</div>
<div class="block_animate" id="block2">Block1</div>

<?php
echo
YsJQuery::newInstance()
  ->onClick()
  ->in('#go1')
  ->execute(
     YsJQuery::animate()
       ->in('#block1')
       ->properties(array('width' => "90%"))
    ,
    YsJQuery::animate()
        ->properties(array('fontSize' => '24px'))
        ->duration(1500)
    ,
    YsJQuery::animate()
        ->properties(array('borderRightWidth' => '15px'))
        ->duration(1500)
  );

echo
YsJQuery::newInstance()
  ->onClick()
  ->in('#go2')
  ->execute(
     YsJQuery::animate()
       ->in('#block2')
       ->properties(array('width' => "90%"))
    ,
    YsJQuery::animate()
        ->properties(array('fontSize' => '24px'))
        ->duration(1500)
    ,
    YsJQuery::animate()
        ->properties(array('borderLeftWidth' => '15px'))
        ->duration(1500)
  );

YsJQuery::newInstance()
  ->onClick()
  ->in('#go3')
  ->execute(
    YsJQuery::add('#go2')->in('#go1'),
    YsJQuery::click()
  )
  ->write();

YsJQuery::newInstance()
  ->onClick()
  ->in('#go4')
  ->execute(
     YsJQuery::css()
       ->in('#block1, #block2')
       ->properties(array('width' => "", 
                          'fontSize' => "",
                          'borderWidth' => ""))
  )
  ->write()
?>


Block1
Block1


The class 'YsJQueryDynamic'

In jQuery you can write the next code:

  jQuery('#foo').slideUp(300).delay(800).fadeIn(400);

To do the same in jQuery4PHP you must use the YsJQueryDynamic object
<?php
echo
new YsJQueryDynamic(
  YsJQuery::slideUp(300)->in('#foo'),
  YsJQuery::delay(300),
  YsJQuery::fadeIn(300)
)
?>

This code return the next sintax:

jQuery('#foo').slideUp(300).delay(300).fadeIn(300)


And continue

In jQuery you can write the next code too:

  jQuery('#foo').slideUp(300);
  jQuery('#bar').delay(800);
  jQuery('#foo-bar').fadeIn(400);

To do the same in jQuery4PHP you must use the YsJQueryDynamic object
<?php
echo
new YsJQueryDynamic(
  YsJQuery::slideUp(300)->in('#foo'),
  YsJQuery::delay(300)->in('#bar'),
  YsJQuery::fadeIn(300)->in('#foo-bar')
)
?>

This code return the next sintax:

jQuery('#foo').slideUp(300);jQuery('#bar').delay(300);jQuery('#foo-bar').fadeIn(300)


New!!! YsUICore

Now jQuery4PHP support the lastest jqueryUI version.
For view all the examples, see the UI section

Remember include the jQueryUI library and styles
<head>
  <link rel="stylesheet" type="text/css" href="path/to/jquery-ui-1.8.2.custom.css">
  <script type="text/javascript" src="path/to/jquery-ui-1.8.2.custom.min.js"></script>
</head>


Extending jQuery4PHP

To be written...





For more info see the examples or go to jQuery4PHP forums in sourceforge.net

About

Demos

jQueryUI

Plugins Support - New!

Components - New!

Project Developed by The YepSua Team
SourceForge.net