jii Javascript library for Yii

  1. Requirements
  2. Other usage examples
  3. Javascript Models
  4. Knockout js utilities
  5. Changelog
  6. Resources

Jii allows you to encode models - and their relations - variables (strings, integers, arrays, floats, booleans) and urls into their Javascript equivalents. You can also use Jii to store your Javascript functions without polluting the global scope. Since version 0.0.3beta, Jii allows you to perform some basic operation on Javascript models and introduces some functions to interact with Knockout js observables. The aim of this extensions is to keep your server side code as well as your client side one more maintainable. Moreover it aims to ease the process of sharing data beetween PHP and Javascript.


Yii 1.1 or above PHP 5 or above

Configuring Yii

Copy Jii folder to your applications protected/components folder. And add the following lines to your config/main.php.

'components' => array(
    'jii' => array(
        'class' => 'application.components.Jii.Jii',
            // uncomment the following 
            // if you do not want to use the minified version
            // 'script' => 'jii-0.0.4.js',
Add Jii to your page

Adding Jii to your page is easy and can be done as follows:

Yii::app()->clientScript->registerScript('jii', Yii::app()->jii->getScript(), CClientScript::POS_END);
Sample usage

You can add params, urls, models and functions to Jii as follows:

// adding params
// you can use any kind of php variable
Yii::app()->jii->addParam('your_param', 10);

// adding urls
Yii::app()->jii->addUrl('view_test_url', $this->createUrl('test/view'));

// adding functions
Yii::app()->jii->addFunction('function', 'function(){ 
    alert("This is an alert!");

Other usage examples

Adding Models to Jii

As regards CActiveRecord instances (or class instances inheriting from CModel), you can select which attribute you want Javascript have access to by adding the following method to each of the CActiveRecord class files you wish to convert ...

    public function getJsonizeables()
        return array(

... and then you can use the following code to add it to Jii:

$jsonized_model = Yii::app()->jii->jsonize($model);

	// adding models to jii
	Yii::app()->jii->addModel('model', $jsonized_model);

Since version 0.0.3beta, Yii::app()->jii->addModel() accepts models and dataproviders as well as jsonized data:

$model = new Model();
Yii::app()->jii->addModel('javascript_model', $model);
Jsonizing CActiveDataProviders

Since jii 0.0.2 you can jsonize CActiveDataProviders as you do with model instances or model arrays:

$jsonized_data_provider = Yii::app()->jii->jsonize($data_provider);

	// adding data provider to jii
	Yii::app()->jii->addModel('model', $jsonized_data_provider);
Adding binding functions

You can add any function that needs to be executed after the page has finished loading with the following code:

    // the following alert will be shown after
    // page has finished loading
    alert("Hello world!");
Jsonizing custom attributes

Sometimes you may need to perform additional operation on models' attributes values before passing them to Javascript. In such cases, you can jsonize custom attributes in the following way. Create or add to the model/model's you wish to jsonize the getJsonizeables method and add to the array a custom attribute name such as custom_attribute_1. After that, create a public method named getcustom_attribute_1() which performs some operation over one ore more model attributes and return a value.


    public function getJsonizeables()
        return array(

    // the following method allows you to jsonize custom attributes
    public function getCustom_attribute_1()
        return $this->_performSomeOperation($this->attribute_label_1);


Javascript Models

Since version 0.0.3beta each Jii model is an object providing the following methods: ~~~ [javascript] /**

  • Finds one model instance based on the specified attribute
  • @param object {attribute: "attribute_name", value: attribute_value}
  • @return object or null if none object is found */ jii.models.javascript_model.findByAttribute();

// the Javascript object representation of a jii Model jii.models.javascript_model.toJS();

// the number of model instances found jii.models.javascript_model.count(); ~~~

Knockout js utilities

Since Jii 0.0.3beta you will have at your disposition a couple of functions: ~~~ [javascript] /**

  • Converts a jii model into an Knockout observable
  • @param object model
  • @return observable */ jii.utils.observable();

// the same as above except that it returns an observable array jii.utils.observableArray(); ~~~


2012-12-14 jii 0.0.4

  • jii script is added through CClientScript and no longer interferes with PHP code
  • jii can be used across the whole page without concurrencies
  • Added function bindings
  • Fixed some minor bugs

2012-12-13 jii 0.0.3beta

  • Some bug fixes

2012-12-12 jii 0.0.3beta

  • Knockout js functions
  • Direct jsonization of models
  • Javascript models functions

2012-12-10 jii 0.0.2

  • Jsonizer support for CActiveDataProvider


3 0
1 387 downloads
Yii Version: 1.1
License: GPL-3.0
Category: Others
Developed by: cgabbanini
Created on: Dec 10, 2012
Last updated: 8 years ago


show all

Related Extensions