X-editable for Yii

Bundle of widgets and server-side component for creating editable elements in Yii application

Download (1.3.1)
based on X-editable 1.4.6


This extension allows you to create editable elements in Yii application.
It contains 4 widgets:

and 2 components:

Since 1.3 you can use it with YiiMongoDBSuite.


Try out demo in widgets section (you can compare different styles using dropdown in top-right corner).


Requirements depend on core library you want to use:

  • Bootstrap
    Twitter Bootstrap 2+, Yii 1.1+.
    You can use Yii-bootstrap extension (2.0+) or include bootstrap js/css manually
  • jQuery UI
    • popup: Yii 1.1.13+ (as requires jQuery UI 1.9 for tooltip)
    • inline: Yii 1.1+
  • only jQuery
    Yii 1.1+


  1. Download and unzip to protected/extensions/x-editable
  2. If using with Bootstrap:

    • install Yii-bootstrap extension
    • include Bootstrap js and css manually:

  3. Modify your config (e.g. protected/config/main.php):

    //assume you unzipped extension under protected/extensions/x-editable
    Yii::setPathOfAlias('editable', dirname(__FILE__).'/../extensions/x-editable');
    return array(
           'editable.*' //easy include of editable classes
        //application components
            //X-editable config
            'editable' => array(
                'class'     => 'editable.EditableConfig',
                'form'      => 'bootstrap',        //form style: 'bootstrap', 'jqueryui', 'plain' 
                'mode'      => 'popup',            //mode: 'popup' or 'inline'  
                'defaults'  => array(              //default settings for all editable elements
                   'emptytext' => 'Click to edit'

That's it!
Now you can edit views and controller actions to have editable elements. Please refer to widgets section.

For any questions feel free to open issue on github.
Your feedback / contribution will be appreciated!