PHPackages                             philippfrenzel/yiidhtmlx - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. philippfrenzel/yiidhtmlx

ActiveYii2-extension

philippfrenzel/yiidhtmlx
========================

Yii2 DHTMLX Widgets

02741JavaScript

Since Mar 23Pushed 12y ago1 watchersCompare

[ Source](https://github.com/philippfrenzel/yiidhtmlx)[ Packagist](https://packagist.org/packages/philippfrenzel/yiidhtmlx)[ RSS](/packages/philippfrenzel-yiidhtmlx/feed)WikiDiscussions master Synced 1mo ago

READMEChangelogDependenciesVersions (1)Used By (0)

yiidhtmlx
=========

[](#yiidhtmlx)

yiidhtmlx components and extensions

1. First widget will be the dhtmlx chart
2. Second widget will be the dhtmlx grid

installation
============

[](#installation)

Add the sources to your composer.json > repositories file:

```
{
    "type": "package",
    "package": {
        "name": "philippfrenzel/yiidhtmlx",
        "version": "0.1.10",
        "authors": [
            {
                "name": "Philipp Frenzel",
                "homepage": "http://frenzel.net"
            }
        ],
        "source": {
            "url": "https://github.com/philippfrenzel/yiidhtmlx.git",
            "type": "git",
            "reference": "master"
        },
        "autoload": {
            "psr-0": { "yiidhtmlx\\": "/" }
        }
    }
}
```

Package is although registered at packagist.org - so you can just add one line of code, to let it run!

```
"require": {
        "philippfrenzel/yiidhtmlx":"*"
},
```

MetroUI already loaded?

- As I use assetparser extension to parse the less files into my distribution, i commented the assets.php to avoid static css loading. If you need the css-files to be loaded statically, pls. uncomment the entries!

Chart
=====

[](#chart)

For a full list of possibilities, pls although check out the website [www.dhtmlx.com](http://www.dhtmlx.com)

Chart renders an DHTMLX chart component.

For example,

```
use yiidhtmlx\Chart;

Chart::widget(array(
	   'options'=>array(
		   'id'    => 'myTestChart',
		   'style' => 'width:280px;height:250px;',
	   ),
    'clientOptions' => array(
        'value' => '#sales#',
		   'label' => '#year#'
    ),
    'clientDataOptions'=>array(
		'type'=>'json',
		'url'=>'data/data.json'))
	),
	'clientEvents'=>array(
		'click'=>'alert("clicked"'),
	)
));
```

Grid
====

[](#grid)

For a full list of possibilities, pls although check out the website [www.dhtmlx.com](http://www.dhtmlx.com)

Chart renders an DHTMLX chart component.

For example,

```
use yiidhtmlx\Grid;

//needs to be registered manualy as the base url is only available later
$this->registerAssetBundle('yiidhtmlx/WidgetAsset');

$imgPath = Yii::$app->assetManager->getBundle('yiidhtmlx/WidgetAsset')->baseUrl . "/dhtmlxGrid/imgs/";

echo Grid::widget(
	array(
		'clientOptions'=>array(
		 	'parent' => 'myTestGrid',
		 	'auto_height' => true,
		 	'auto_width' => true,
		 	'skin' => "dhx_terrace",
		 	'columns' => array(
		 		array('label'=>'id','width'=>'40','type'=>'ro'),
				array('label'=>array(Yii::t('app','Address'),'#text_filter'),'type'=>'ed'),
				array('label'=>array(Yii::t('app','Name'),'#text_filter'),'type'=>'ed'),
				array('label'=>array(Yii::t('app','N/O'),'#select_filter'),'width'=>'50','type'=>'ch'),
				array('label'=>Yii::t('app','Cap.'),'width'=>'100','type'=>'ed'),
			),
		 	'image_path' => $imgPath
		),
    'enableSmartRendering' => false,
    'options'=>array(
			'id'    => 'myTestGrid',
		),
		'clientDataOptions'=>array(
			'type'=>'json',
			'url'=>Html::url(array('/location/jsongridlocationdata'))
		),
		'clientEvents'=>array(
			'onRowSelect'=>'doOnRowSelect',
		)
	)
);
```

As we are using smart rendering, the full functionality in the controller referenced by url should look as followed:

```
   /**
   * returns the json for the dhtmlx grid
   * @param  date  $un       YYYYMMDD
   * @param  integer $posStart current position in grid scroll
   * @param  integer $count    last record handed over
   * @return JSON               json object, see dhtmlx for more information
   */
  public function actionDhtmlxgrid($un=NULL, $posStart=0, $count=0){
    $currentPage = 0;
    $pageSize = 50;

    if($posStart>0){
      $currentPage = round(($posStart / $pageSize),0);
    }

    $query = new Query;
    $provider = new ArrayDataProvider([
      'allModels' => $query->select('id,organisationName,taxNumber,registrationCountryCode')->from('tbl_party')->all(),
      'sort' => [
        'attributes' => ['id', 'organisationName', 'taxNumber'],
      ],
      'pagination' => [
        'pageSize' => $pageSize,
        'page' => $currentPage
      ],
    ]);

    //the grid header to pass over total count
    $clean = ['total_count'=>Party::find()->count(),'pos'=>$posStart];
    foreach($provider->getModels() AS $record){
      if(!is_null($record))
      {
        $clean['rows'][]=['id'=>$record['id'],'data'=>array_values($record)];
      }
    }

    header('Content-type: application/json');
    echo Json::encode($clean);
    exit();
  }

```

If you wanna script using the id of the object, the name will be "dhtmlxID" -> dhtmlxmyTestGrid.

- The clientOptions->parent must be the same as the options->id !
- The skin is currently default to dhx\_terrace.
- For a complete list of clientOptions check out the dhtmlx.com webpage
- While you set auto\_height to false, you need to add in options->style:"height:400px"

Tree and Contextmenu
====================

[](#tree-and-contextmenu)

The following sample let's you attach an right mouse menu to the tree

```
$imgPath = Yii::$app->assetManager->getBundle('yiidhtmlx/WidgetAsset')->baseUrl . "/dhtmlxTree/imgs/csh_dhx_terrace/";
$imgMenuPath = Yii::$app->assetManager->getBundle('yiidhtmlx/WidgetAsset')->baseUrl . "/dhtmlxMenu/imgs/dhxmenu_dhx_terrace/";

echo Menu::widget(
	array(
		'clientOptions'=>array(
		 	'parent' => 'myCMSTreeMenu',
		 	'skin' => "dhx_terrace",
		 	'context' => true,
		 	'image_path' => $imgMenuPath,
		 	'items' => array(
		 		array('id'=>'createchild','text'=>'Create new Child','img'=>'img/dhtmlx/s4.gif'),
		 		array('id'=>'gotoparent','text'=>'Go to Parent','img'=>'img/dhtmlx/s3.gif')
		 	)
		),
	    'options'=>array(
			'id'    => 'myCMSTreeMenu',
		),
		'clientEvents'=>array(
			'onClick' => 'doOnMenuSelect',
		)
	)
);

echo Tree::widget(
	array(
		'enableContextMenu'=>'dhtmlxmyCMSTreeMenu',
		'clientOptions'=>array(
		 	'parent' => 'myCMSTree',
		 	'skin' => "terrace",
		 	'image_path' => $imgPath,
		 	'width' => '100%',
		 	'height' => '200px',
		 	'checkbox' => false,
		 	'smart_parsing' => true,
		),
	    'options'=>array(
			'id'    => 'myCMSTree',
		),
		'clientDataOptions'=>array(
			'type'=>'json',
			'url'=>Html::url(array('/pages/jsontreeview','rootId'=>$rootId))
		),
		'clientEvents'=>array(
			'onClick' => 'doOnRowSelect',
		)
	)
);

$jumpTarget = Html::url(array('/pages/view','id'=>''));
$jumpJS = registerJs($jumpJS); //where $this is the current view!
```

Tabbar Object
=============

[](#tabbar-object)

```
use yiidhtmlx\Tabbar;

echo Tabbar::widget(
  [
  'clientOptions'=>[
      'parent'      => 'PurchaseOrderTabbar',
      'image_path'  => Yii::$app->AssetManager->getBundle('yiidhtmlx\TabbarObjectAsset')->baseUrl."/dhtmlxTabbar/imgs/dhx_terrace/",
      'skin'        => "dhx_terrace",
      'tabs' => [
        ['id'=> 'tab_one','label'=>'id','width'=>'100%']
      ],
    ],
    'tabs'=>[
      ['tab_one'=>'tabrequested']
    ]
  ]
);

```

###  Health Score

22

—

LowBetter than 23% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity12

Limited adoption so far

Community8

Small or concentrated contributor base

Maturity41

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

### Community

Maintainers

![](https://www.gravatar.com/avatar/551abd4470d98ae959df06678c17aef3e8ac35187884a2872e79c77e040b5c8b?d=identicon)[philippfrenzel](/maintainers/philippfrenzel)

---

Top Contributors

[![philippfrenzel](https://avatars.githubusercontent.com/u/2319890?v=4)](https://github.com/philippfrenzel "philippfrenzel (184 commits)")

### Embed Badge

![Health badge](/badges/philippfrenzel-yiidhtmlx/health.svg)

```
[![Health](https://phpackages.com/badges/philippfrenzel-yiidhtmlx/health.svg)](https://phpackages.com/packages/philippfrenzel-yiidhtmlx)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)