Yii-GTreeTable is extension of Yii framework which is wrapper for bootstrap-gtreetable plugin, on the other hand provides support to server side application.
Thanks to software it's possible to map actual state of nodes to data base.
Test available on demo project.
For Yii 2 see yii2-gtreetable.
Requirements ¶
- PHP 5.2 or above,
- Yii 1.1 or above,
- Twitter Bootstrap 3.
Installing and configuring ¶
See project page.
gilek
User Contributed Notes 8
Very Nice extension.
It is simple and light-weight extension and easily implemented for nested set administration.
It would be nice to further enhance the view of the tree. Here parent node and its children are shown as in the same level. I cant see any space before child nodes like in the given snapshot.
Alos in 'NodeChildrenAction' class Line# 21, 'Unit' can be specified dynamically as:
Overall, nice contribution.
Thank you.
Re: Very Nice extension.
This problem occurs in Chrome. I will be soon repaired.
Re2: Very Nice extension
Of course! Thank you.
How to update custom fields
I have a scenario where I need to update additional fields in 'tree' table. How this can be achieved?
Re: How to update custom fields
Update:
Since version 1.2a you can define custom action, for example:
<?php $this->widget('ext.gtreetable.EGTreeTable',array( 'htmlOptions'=>array('id'=>'tree1'), 'options'=>array( 'source' => "js:function(id) { return '".$this->createUrl('gtreetable/nodeChildren')."'+'?id='+id; }", 'actions'=>array( array( 'name'=>'Something', 'event'=>'js:function(node) { /* code */ }' ), ) ), )) ?>I don't know at which point it should be changed. Whether, after saving or on demand?
If the latter, I think, you should add new action. Unfortunately at this moment, there is no possibility to define it directly in plugin.
Maby in the near future I will correct it.
Anyway, I know only about one solution, but is very unsightly.
1. You must define new template
<?php $this->widget('ext.gtreetable.EGTreeTable',array( 'htmlOptions'=>array('id'=>'tree1'), 'options'=>array( 'source' => "js:function(id) { return '".$this->createUrl('gtreetable/nodeChildren')."'+'?id='+id; }", 'template'=>'<table> <tr class="node node-collapsed"> <td> <span><span class="node-indent"></span><i class="node-icon glyphicon glyphicon-chevron-right"></i><i class="node-icon-selected glyphicon glyphicon-ok"></i><span class="node-name"></span></span> <span class="hide node-action"> <input type="text" name="name" value="" style="width: 60%" class="form-control" /> <button type="button" class="btn btn-sm btn-primary node-save">Save</button> <button type="button" class="btn btn-sm node-saveCancel">Cancel</button> </span> <div class="btn-group pull-right"> <button type="button" class="btn btn-sm btn-default dropdown-toggle node-actions" data-toggle="dropdown">Actions<span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li role="presentation" class="dropdown-header">Actions</li> <li role="presentation"><a href="#notarget" class="node-create" tabindex="-1">Add</a></li> <li role="presentation"><a href="#notarget" class="node-update" tabindex="-1">Edit</a></li> <li role="presentation"><a href="#notarget" class="node-delete" tabindex="-1">Delete</a></li> <li role="presentation"><a href="#notarget" class="node-something" tabindex="-1">Something</a></li> </ul> </div> </td> </tr> </table>', ) )) ?>2. Next handle action.
~~~
[javascript]
jQuery(document).ready(function() { jQuery('.node-something').live('click',function() { console.log(jQuery(this).parents('.node').data()); // open modal dialog }); });~~~
Should tree table be created?
Hi gilek,
Great extension. I want to use this to display Chart of Accounts on my Accounting app. The situation is that I have accounts table. Since accounts are hierarchical, displaying them on CGridView would not be appropriate. The idea is to show accounts using gtreetable. On click the node, it will show the detail (CDetailView). The tree would be read only and the detail view might be combined with editable so that user can update straight away. Delete is also handle separately from the tree since deleting a node which has children would not be allowed.
Questions:
Do I need a tree table to handle the tree? I can get the level from the code directly since I can store the level on account table or usually I calculate the level from the number of "." on the code field of account table. The code rule is First level is using 1, 2, 3, ... second level is 1.1, 1.2, ..., 1.10, 1.11, 2.1, 2.2,..... third level is 1.1.1, 1.1.2,.....
On tree table, it was defined a lft and rgt. What are their significance? I want to display the chart in the sorted ascending.
On the example, the node only shown one column per row, category. Is that possible to show Account code, name, normalbalance on the table per row (multiple columns on one row)?
Thank you.
Daniel
Re: Should tree table be created?
Hi Daniel,
I'm glad you liked it. I hope it has been helpful.
My extension uses another extension named nestedset.
Please, go to the project page and see documentation. There you can find all information about significance lft and rgt columns.
Sorting nodes by name may be achieved by:
a. Defining new scope in tree model:
public function scopes() { return array( 'sorted'=>array( 'order'=>'`name` ASC' ) ); }b. Changing code in nodeChildrenAction:
$nodes = $root ? array($parent) : $parent->children()->findAll();to
$nodes = $root ? array($parent) : $parent->children()->sorted()->findAll();At this moment there in no possibility to define addition column. In nearest future it will be fixed.
tree:relatedNode not defined
This is a wonderful extension.
Easy integration.
However i am getting tree:relatedNode not defined when am trying to create a child node
i added public $relatedNode to my class and its yet not working.
Leave a comment
If you have any questions, please ask in the forum instead.
Join the conversation to share a note.