Overview ¶
This extension allows you to create editable elements on your page.
It contains 4 widgets:
- Editable - single editable element
- EditableField - editable element related to attribute of model
- EditableDetailView - editable detail-view for entire model
- EditableColumn - editable column in GridView
and 2 components:
- EditableConfig - used in config file to setup extension
- EditableSaver - used in controller actions to update records
Since 1.3 you can use it with YiiMongoDBSuite.
Demo, Docs & Download ¶
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.
Maintainer needed! More details here.
Changelog ¶
Version 1.3.1 Aug 17, 2013 ¶
[enh] conversion nl2br no more needed for textarea (vitalets)
[enh] updated to x-editable 1.4.6 (vitalets)
[enh #63] allow usage with EDataTables (vitalets, faravaghi)
[bug #66] date & datetime are not processed if passed as timestamp string (vitalets)
[enh #19] i18n support for "clear" in date & datetime (vitalets)
[enh #40] evaluate htmlOptions for EditableColumn (horizons2, vitalets)
[enh #57] added support for CFormModel (vitalets)
[enh #55] support of inline functions in column value (vitalets)
Version 1.3.0 Jun 29, 2013 ¶
[enh #43] support for non-scalar virtual attributes (pavshuk)
[enh] update x-editable js to 1.4.5 (vitalets)
[enh] added mongoDB support (vitalets)
[enh #48] scenario is taken dynamically from model and used in EditableSaver (vitalets)
[enh #46] add liveTarget option to support live update in CListView (vitalets)
Version 1.2.0 May 29, 2013 ¶
[enh #7] column sort icons for bootstrap (vitalets)
[bug #41] if all columns have apply=false grid becomes un-editable after update (horizons2)
[enh #39] support php < 5.3 (vitalets)
[enh #37] added Editable::source method (vitalets)
[enh #38] CSRF support out of box (horizons2)
[enh #35] support of dates as timestamp (andersonamuller)
[enh] support of virtual_fields in EditableColumn (vitalets)
Version 1.1.0 May 18, 2013 ¶
[enh #33] allow apply as a PHP expression in EditableColumn (oinegue)
[enh #22] allow CArrayDataProvider for EditableColumn (ciarand)
[enh] added bootstrap datetime support (vitalets)
[enh #5] source as array is always data, not Yii route (vitalets)
[enh #9] support for namespaced models (vitalets)
[enh] updated to x-editable 1.4.4: added combodate and select2 (vitalets)
[enh #16] EditableDetailView defaults + french translation (mdeweerd)
[bug] If apply = true, attribute can be unsafe (vitalets)
[enh] Added composer support (vitalets)
[chg] EditableDetailView emptytext no more taken from nullDisplay option (vitalets)
[bug] Disable loading Yii's css for EditableDetailView in bootstrap mode (vitalets)
[enh #6] Added support of composite primary keys (vitalets)
[enh] Added Italian messages (vitalets)
Version 1.0.0 Dec 26, 2012 ¶
Initial release.
Vitalets
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.
Re: Composite keys for primary key?
hi, yes it's bug. Will fix in nearest release. Issue on github.
thx!
Support for select2 ?
Hi, first of all thanks for this great extension.
Is it possible to update this extension to also support select2 widgets ?
Re: Support for select2
hi, yes I plan to update on x-editable 1.4.1 within 1-2 weeks.
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.
Re: Not using models
yes, it can be raw
Editableclass that can be internally used byEditableField.if you make pull request on github, it would be wonderfull =)
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.
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
typeparameter when configuring EditableField..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!
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?
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
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
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.
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
EditableFieldwidget reporting that no bootstrap component exists.How can I use x-editable, having included the bootstrap files manually?
Thank you!
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.
Re: Re: Bootstrap included manually
Thanks @haymps!
I included the bootstrap files manually, i.e.
bootstrap.js,bootstrap.cssandbootstrap-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-editablework under these conditions?Cheers
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.
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.
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 }; }' ), ));Filter and Sort?
Can anyone tell me how to filter and sort on a related model? For example:
array( 'class' => 'editable.EditableColumn', 'name' => 'relation.field_id', 'header'=>'Field', 'value'=> 'CHtml::value($data, "relation.field.somename")', 'filter'=>CHtml::listData($this->getClientFields(), 'field_id','field.somename'), 'editable' => array( 'type'=>'select', 'url' => $this->createUrl('updateEditable', array( 'model'=>'Model', 'field'=>'field_id')), 'source' => CHtml::listData($this->getClientFields(), 'field_id', 'field.somename'), 'placement' => 'right', 'inputclass' => 'span3', ), ),In the compare statement in the Model I would normally create a pseudo element and call that in the grid, and the sort and the compare.
How do I do it with this method?
Re: Filter and Sort?
hi deez,
your post bring me to some investigation of sources. I made several changes and will release 1.1.1 within a few days.
Thanks!
Awesome
Thanks vitalets. Great extension by the way.
Re: Filter and Sort?
@deez
please have a look on updated demo of 1.2.0, there is example of sorting by related model.
Filter and Sort
Works like a charm. Thanks again!
apply - depending on $data value
Hello guys,
i would like to give a tip for the "apply" value in EditableClass, just change the line 65:
if($widget->apply)) {
to
if(!eval('return '.$widget->apply.';')) {
and now you are able to parse some really awesome conditions like:
....
'apply'=>'($data->manualPrice && strtotime($data->toDate)>strtotime(date("Y-m-d")))',
....
Thanks for the great extension!
P.S: There is a bug by date field, when i pass there a date like 2013-06-19 the field is always showing the todays date, i think there will be good to give the valueFormat.
Using with mongoDB suite
Hi, i'm try to use this great extension with mongoDBsuite and it work fine!
but i have a problem with embedded document in a "root" model, i can't edit the fields of embedded document. I try to explain with my real case:
My model is User.php and my embedded document is Profile.php. If I use edidableField widget and i try to edit a filed of embedded document for example $user->profile->name the field is not editabled.
I hope it is clear.
Thank you
Re: apply - depending on $data value
@Edgar Kuskov,
evaluating
applyis seems to be already done.have a look on:
https://github.com/vitalets/x-editable-yii/blob/master/EditableColumn.php#L95
For invalid date - could you show the full snippet?
@cico
could you show the code how you create widget for
user.profile.name?vitaliy
Re: Using with mongoDB suite
Hi thank you for your fast reply i use this on my profile/view.php:
$this->widget('editable.EditableField', array( 'type' => 'text', 'model' => $model, 'attribute' => 'profile.city', 'url' => $this->createUrl('user/updateUser'), 'placement' => 'right', ));on my UsereController.php
public function actionProfile(){ $model = User::model()->findByPk( new MongoID(Yii::app()->user->id) ); $this->render('profile/view',array( 'model'=>$model, )); }on my User.php
public function rules() { return array( array('email, status, profile.city', 'safe'), ); } public function embeddedDocuments() { return array( // property field name => class name to use for this embedded document 'profile' => 'Profile', ); }i set on my embedded document Profile.php
class Profile extends EMongoEmbeddedDocument { public $lastname; public $firstname; public $street; public $city; public $zip; public $phone; public $cellular; /** * @return array validation rules for model attributes. */ public function rules() { return array( //array('lastname, firstname, street, city, zip, phone, cellular', 'required'), array('lastname, firstname', 'length', 'max'=>50), array('phone, cellular', 'numerical', 'min'=>8, 'max'=>15, 'tooSmall'=>'Campo non valido inserisci un numero corretto', 'tooBig'=>'Campo non valido inserisci un numero corretto'), // The following rule is used by search(). // Please remove those attributes that should not be searched. array('lastname, firstname, city, zip', 'safe'), ); }to use this modules i also edit your file EditableSaver.php here
//loading model $this->model = CActiveRecord::model($this->modelClass)->findByPk(new MongoId($this->primaryKey)); ...and here
//saving (no validation, only changed attributes) if ($this->model->update($this->changedAttributes, true)) { ...Related editables?
Good day. First I want to thank you about such a great extension, it works perfectly.
But I have a question. Is it possible to DYNAMICALLY update Source of one editable select element based on value, that was set in other?
For example I have two select-fields - Country and City, and after Country update via your extension, I want to update corresponding City array. It seems, that I have to do it in "success" ajax response, but I cannot find how can I update the array.
Anybody could make a tip for me? Thanks!
Re: Related editables?
hi, yes you are right, you should update
sourceof second select insuccessof first.please have a look on this: http://jsfiddle.net/xBB5x/297/
EditableDetailView
Everything works great except the EditableDetailView widget. Not sure what's going on, it just stops loading the page with a 500 network error. I can't see anything about it in the Yii logs, either. Anyone else have this problem or any ideas about what could be causing it?? Thanks!
Re: EditableDetailView
hi, mtzmedia
could you show your view and controller code?
Composite primary key for EditableField
[edit: addition]
Okay, I've found out, by scrolling trough the classes, that, to my surprise, there is a field
pkwhich can be filled. With that thedata-pk="<some JSON>"is filled (the code below is what my widget looks right now).But then another problem rises:
In short this is the code for the action.
$es = new EditableSaver('RoosterRegel'); $es->update();Only there is a problem: the update doesn't allow to have a non-existing record. Although the scenario I see when debugging has a statement which
shouldimply that there is a possibility to make an insert, but it seems to not being used for creating the model before checking it from the db.$this->scenario = yii::app()->request->getParam('scenario');`EditableSaver.php:105'$this->widget('editable.EditableField', array( 'type' => 'select', 'model' => $modelRoosterRegel, 'pk' => $modelRoosterRegel->primaryKey, 'attribute' => 'idItem', 'url' => $this->createUrl('RoosterRegel/UpdateRoosterRegel'), 'source' => Editable::source($itemSoortListData), 'params' => array('idTeam' => $model->idTeam)) );[/edit]
Hi,
I'm trying to edit a value from a model which has a composite primary key. I can change the value on the website but it doesn't fire an Ajax request to
RoosterRegel/UpdateRoosterRegel. I created this code to test it, and I can't see what I'm doing wrong. I cannot find there is anydata-pk="<some JSON>"code in the HTML but I can't see where I should put it.I hope you can help.
$itemSoortListData = CHtml::listData(Item::model()->findAllByAttributes(array('idItemSoort' => 1)), 'idItem', 'Beschrijving'); $modelRoosterRegel = new RoosterRegel(); $modelRoosterRegel->idStdActiviteit = 4; $modelRoosterRegel->idVereiste = 1; $modelRoosterRegel->idPlanning = 75; $this->widget('editable.EditableField', array( 'type' => 'select', 'model' => $modelRoosterRegel, 'attribute' => 'idItem', 'url' => $this->createUrl('RoosterRegel/UpdateRoosterRegel'), 'source' => Editable::source($itemSoortListData), 'params' => array('idTeam' => $model->idTeam)) );Inserting new record.
EditableSaver does no allow the insertion of a new record as you indicate, it is for updating a record;
The scenario is used and set on the model after the model has been retrieved from the DB.
One typical use of a scenario is when you want the change the rule checking ('validate'). That should work.
One method that I see which could be used is to define a behavior on EditableSaver to create the record in 'onBeforeUpdate' if you would like to do so (when the PK is not found).
How create displayed select
Hi.
I used to create drop-down lists with inactive items 'disabled'=>'disabled' ?
For this, I wrote a function.
View. <?php echo $form->dropDownList($model,'driver', CHtml::listData(Driver::model()->findAll(array('order'=>'active DESC')),'id', 'last_name'), array('prompt'=>'Select a driver:','options'=>Truck::notactivedrivers())); ?> Model. public function notactivedrivers() { $viborka=new CDbCriteria; $viborka->select=array('id','first_name','active'); $viborka->condition='active=:postID'; $viborka->params=array(':postID'=>'no'); $blabla= Driver::model()->findAll($viborka); $ar = array(); foreach ($blabla as $qw) { $ar[$qw->id] = array('disabled'=>'disabled'); } return $ar; }How do I make now some items inactive with x-editable. An example of what I need:
Your text to link here...
Where insert disabled fields array here?
array( 'class' => 'editable.EditableColumn', 'name' => 'current_driver_1_id', 'headerHtmlOptions' => array('style' => 'width: 100px'), 'editable' => array( 'type' => 'select', 'url' => $this->createUrl('truck/updateUser'), 'source' => Editable::source(Driver::model()->findAll(array('order'=>'active DESC')),'id', 'last_name'), //onsave event handler 'onSave' => 'js: function(e, params) { console && console.log("saved value: "+params.newValue); }', ) ),Thanks.
EditableField type select2 disappear with Google Chrome!!!
Hi,
A big thanks for @Vitalets for this awesome ext.
I have a probleme with Google Chrome. When I try to fill my EditableField select2 type The field disappear.
Is there any fix for this issue?
Thanks again.
Yii error when debugging?
Fantastic extension!
Error might be a Yii issue and not a x-editable issue.
When I debug Yii, I get an error when I use EditableColumn type 'select'.
My model name is 'ar_trn18', but somewhere it is turned into 'Ar_trn18', which results in the error in YiiBase::autoload.
This happens only when I use debug in Yii config file. If I do not debug, then there is no error.
Stack trace:
exception 'CException' with message 'Class name "Ar_trn18" does not match class file "C:\xampp\htdocs\iccap\frontend\config\..\..\common\models\Ar_trn18.php".' in C:\xampp\htdocs\iccap\common\lib\Yii\YiiBase.php:418 Stack trace: #0 [internal function]: YiiBase::autoload('Ar_trn18')Hi any one could help, I got response is undefined error in console
Hi When I tried to update using editable form it just shows
TypeError: response is undefined in console please could any body help me. See the drop box link below of print screen of error.
https://www.dropbox.com/s/am9sfpkrqx0pfgy/Screenshot 2014-11-14 08.01.23.png?dl=0
Seems to break in Yii 1.1.16
Hi
For info to other users: the extension (popups in jQueryui mode at least) seem to break in 1.1.16 because of the upgrade to a very recent jQuery and the use of the internal jQuery '_find' function.
Fixed it by changing the tip code where the '_find' call is made.
tip: function() { return this.container()? $('#'+this.container().element.attr('aria-describedby')):null; },update extension
Hi Vitalets, can you update this extension with Yii2?
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.