x-editable

Bundle of widgets and server-side component for creating editable elements
39 followers

Overview

This extension allows you to create editable elements on your page.
It comes instead of previous yii-bootstrap-editable that was upgraded to X-editable library.
Major changes are:

  • support of several libraries: Twitter Bootstrap, jQuery UI and pure jQuery
  • popup and inline modes. You can toggle it from config without changing code
  • update of related models

It contains 3 widgets:

and 2 components:

Demo, Docs & Download

Please visit extension homepage: x-editable.demopage.ru

Requirements

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 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+

Support

If you have any questions or ideas feel free to ask in comments or open issue on github page.

Total 19 comments

#13190 report it
Caio P. at 2013/05/13 03:32am
Replace value shown with server response

In case it helps anyone that needs to replace the user input with the actual saved value from the model.

In the controller:

/* after treatment of POSTed value into $model->value */
echo CJSON::encode(array('success' => true, 'newValue' => $model->value));

And in the view:

$this->widget('editable.EditableField', array(
    /* ... */
    'options' => array(
        'success'=>'js:function($response, $newValue) {
            var parsedResponse = JSON.parse($response);
            return { newValue: parsedResponse.newValue };
        }'
    ),
));
#12748 report it
Vitalets at 2013/04/09 02:14pm
re: Integrate in search form of grid view

hi,

For view please see samples.
For controller, if you are not updating model and just perform search, you just create action and use data from $_POST.

#12744 report it
zvik2004 at 2013/04/09 12:11pm
Integrate in search form of grid view

Hi, Great extension! I have a grid, and I have a search form for this grid. I would like to replace this search form with elements from this extension. Can you please have an example of what would be in the view and the controller? Thanks in advance! Zvi.

#12697 report it
clapas at 2013/04/06 05:45am
Re: Re: Bootstrap included manually

Thanks @haymps!

I included the bootstrap files manually, i.e. bootstrap.js, bootstrap.css and bootstrap-responsive.css.

I didn't add any extension nor did I change any configuration. I thought this implied that I added bootstrap manually.

Is it possible to make x-editable work under these conditions?

Cheers

#12688 report it
haymps at 2013/04/05 09:28am
Re:Bootstrap included manually

Have you downloaded bootstrap into your extensions folder?

Then add this in config/main.php

Yii::setPathOfAlias('editable', dirname(__FILE__).'/../extensions/x-editable');
Yii::setPathOfAlias('bootstrap', dirname(__FILE__).'/../extensions/bootstrap');
...
// application components   
    'components'=>array(
    'bootstrap'=>array(
            'class'=>'bootstrap.components.Bootstrap',
        ),
        //X-editable config
        'editable' => array(
            'class'     => 'editable.EditableConfig',
            'form'      => 'bootstrap', 
            'mode'      => 'popup',      
            'defaults'  => array(        
             'emptytext' => 'Click to edit',

-all the best.

#12684 report it
clapas at 2013/04/05 04:28am
Bootstrap included manually

Hello,

I'm not using the Yii-bootstrap extension but included bootstrap manually. However, I get an exception when I try to use the EditableField widget reporting that no bootstrap component exists.

How can I use x-editable, having included the bootstrap files manually?

Thank you!

#12273 report it
le_top at 2013/03/10 11:09pm
Updates for EditableDetailView

Thanks for the extension. I was about to make a similar (lighter) one for DetailViews and I discovered this extension which already did pretty much what I needed.

I made some improvements so that it is easier to set default options for the 'EditableField' which is called by the 'EditableDetailView' (especially 'success') along with some other improvements/corrections.

All options of 'EditableField' are now available as options of 'EditableDetailView'. And I added the French translation.

I made a Pull Request with my changes.

#12119 report it
Daniel at 2013/02/27 07:53pm
X-editable 1.4.1

Hi Vitalets,

When I looked at the X-editable, it is already in version 1.4.1. While X-editable-yii v1.0 is still using X-editable 1.3.0. If, I just change the js and css files, Is it possible to do so? The feature that I really waiting for is Select2.

Could not wait for you to release new X-editable-yii.

Thanks,

Daniel

#12036 report it
Daniel at 2013/02/22 08:38am
EditableColumn of related model

Hi,

I have two models, Product and ProductPrice.

Product

id name unit

ProductPrice

id productFk FK to product(id) description minQty price

I have TBGridView of Product that also shows the Price for each product based on its min quantity of purchase. TBGridView is like this

| No | Name | Unit | Price Min Qty = 1| Price Min Qty = 3 | Price Min Qty = 6

Price Min Qty is defined on model ProductPrice while the TbGridView is using model Product (the $model is Product). I set editable for all Price Min Qty, how could I acomplish this task?

Cheers,

Daniel

#11955 report it
Vitalets at 2013/02/15 05:11am
Re: Variable types

yes, EditableColumn can only set single type for whole column.
But it's interesting, what is your final task?
maybe EditableDetailView would be suitable?

#11936 report it
haymps at 2013/02/13 03:40pm
Re: Re: Variable types - and new types 'text', 'select', 'date' etc.

I'm trying to do two things: Currently the type field applies to the entire column. The column is text or the column is data picker, etc. In thinking about it, I could pass in an array that has the type for each row of the column.

The other item is to add a color picker to one of the types. I will loog tat github link provided by Vitalets. Thanks!

#11929 report it
Vitalets at 2013/02/13 10:02am
Re: Variable types - and new types 'text', 'select', 'date' etc

Dont' exactly get what you mean, sorry..
If you want to create new type for x-editable, you can do it in javascript part first.
see https://github.com/vitalets/x-editable
If you want to render different existing types in table rows, just use type parameter when configuring EditableField..

#11911 report it
haymps at 2013/02/12 05:09pm
Variable types - and new types 'text', 'select', 'date' etc.

I'm trying to do two things: Currently the type field applies to the entire column. The column is text or the column is data picker, etc. In thinking about it, I could pass in an array that has the type for each row of the column.

The other item is to add a color picker to one of the types. I will loog tat github link provided by Vitalets. Thanks!

Variable types - and new types 'text', 'select', 'date' etc. I am using this extension - grateful for it! I would like to update it to support variable types per row. This would be based on a type field in the table itself. Also, i'd like to add a color picker for one of the types.

Widgets and AJAX is foreign to me, but I'm trying to figure it out. Does anyone have any advise on where I should look to change the extension. I'm in the EditableField.php, but can't see much in there to work with.

#11860 report it
Vitalets at 2013/02/08 03:09am
Re: Not using models

yes, it can be raw Editable class that can be internally used by EditableField.
if you make pull request on github, it would be wonderfull =)

#11830 report it
Chillance at 2013/02/06 02:10pm
Not using models

Hey, so this is a cool extension! However, EditableField seems to depend on providing a model and an attribute. Could you make it not require that?

Having a model I guess is most common, but in my case I get data from the database, do stuff with it, and show part of it, so I don't have that 1-1 mapping. And thus, I want some nice way to just show the text to be edited, and when changed, I do some ajax calls, doing the logic there and in the controller called by ajax. This could be handy to have in all Editable* I suppose.

I'm sure I can do the edit myself, but I figured it's better to get an official fix, so I don't have to merge the code after every update.

#11779 report it
Vitalets at 2013/02/03 02:02pm
Re: Support for select2

hi, yes I plan to update on x-editable 1.4.1 within 1-2 weeks.

#11773 report it
avraham at 2013/02/02 07:48pm
Support for select2 ?

Hi, first of all thanks for this great extension.

Is it possible to update this extension to also support select2 widgets ?

#11696 report it
Vitalets at 2013/01/28 04:45am
Re: Composite keys for primary key?

hi, yes it's bug. Will fix in nearest release. Issue on github.
thx!

#11640 report it
nath-0 at 2013/01/24 09:10am
Composite keys for primary key?

Hello,

I download this extension as it was tolden me in the previous extension (yii-bootstrap-editable).

It seems that the extenion still doesn't work with composite primary key.

at this point :

public function getSelector()
     {
        return get_class($this->model) . '_' . $this->attribute . ($this->model->primaryKey ? '_' . $this->model->primaryKey : '_new');
     }

You can not have a array which is that you have with composite primary keys.

Leave a comment

Please to leave your comment.

Create extension
Downloads
No downloadable files yet