search

leandrogehlen / yii-easyui

Extension for Yii Framework to work with jQuery EasyUI. See http://www.jeasyui.com
26 stars 14 forks source link

readme

Yii EasyUI

Yii EasyUI is a extension of Yii that helps to work with jQuery EasyUI library.

The extension implements widgets for writing the componentes javascript.

Including the resources

Download http://www.jeasyui.com/download/, extracting content in js/jquery-easyui Download yii-easyui extracting content in protected/extensions

Configuration

Is necessary that the controllers extends of class EuiController

Yii::import('ext.yii-easyui.base.EuiController');

class SiteController extends EuiController {

    public function actionIndex()
    {
          $this->render('index');
    }
}

Important!

The native css files used by Yii generate conflicts with jQuery EasyUI To avoid conflict REMOVE the following lines in protected/views/layouts/main.php

<!-- blueprint CSS framework -->
<link rel="stylesheet" type="text/css" href="https://github.com/leandrogehlen/yii-easyui/blob/master/<?php echo Yii::app()->request->baseUrl; ?>/css/screen.css" media="screen, projection" />
<link rel="stylesheet" type="text/css" href="https://github.com/leandrogehlen/yii-easyui/blob/master/<?php echo Yii::app()->request->baseUrl; ?>/css/print.css" media="print" />

<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css" href="https://github.com/leandrogehlen/yii-easyui/blob/master/<?php echo Yii::app()->request->baseUrl; ?>/css/ie.css" media="screen, projection" />
<![endif]-->

<link rel="stylesheet" type="text/css" href="https://github.com/leandrogehlen/yii-easyui/blob/master/<?php echo Yii::app()->request->baseUrl; ?>/css/main.css" />
<link rel="stylesheet" type="text/css" href="https://github.com/leandrogehlen/yii-easyui/blob/master/<?php echo Yii::app()->request->baseUrl; ?>/css/form.css" />

Widgets

In view files is possible to write widget components to render JQuery Easyui format, according to the following example:

$this->widget('ext.yii-easyui.widgets.EuiWindow', array(
    'id' => 'win',
    'title' => 'My Window',
    'style' => 'width:500px;height:250px;padding:10px;'
));

Results:

Hello World