zertex/yii2-gridstackjs

Gridstack.js widget for Yii2

1.0.2 2018-05-15 10:47 UTC

Requires

• bower-asset/jquery: >= 1.11.0
• bower-asset/jquery-ui: >= 1.11.0
• yiisoft/yii2: *

MIT

• Zertex

• jquery
• plugin
• extension
• responsive
• grid
• yii2
• drag-and-drop
• multi-column
• gridstack
• gridstack.js

README

Интеграция в Yii2 Gridstack.js

Установка

Желательно устанавливать через composer.

В консоли укажите

php composer.phar require --prefer-dist zertex/yii2-gridstackjs "*"

или добавьте в composer.json

"zertex/yii2-gridstackjs": "*"

Использование

Используйте Gridstack.js как любой другой виджет Yii2.

use zertex\gridstack\Gridstack;

<?php
$gridstack = Gridstack::begin([
    'options'=>['class'=>'grid-stack'],
    'clientOptions'=>[
        'cellHeight'=> 80,
        'verticalMargin'=> 10,
    ],
]);?>

<?=$gridstack->beginWidget(['class'=>'grid-stack-item','data-gs-width'=>"4",'data-gs-height'=>"2",'data-gs-x'=>"0",'data-gs-y'=>"0",]);?>
    <div class="grid-stack-item-content"></div>
<?=$gridstack->endWidget();?>

<?=$gridstack->beginWidget(['class'=>'grid-stack-item','data-gs-width'=>"4",'data-gs-height'=>"4",'data-gs-x'=>"4",'data-gs-y'=>"0",]);?>
    <div class="grid-stack-item-content"></div>
<?=$gridstack->endWidget();?>

<?php
Gridstack::end();
?>

Для использования Gridstack.js в JavaScript добавьте GridstackAsset в представлении.

public $depends = [
...
'zertex\gridstack\GridstackAsset',
...
];