2017 © Pedro Peláez
 

yii2-extension yii2-dragula

asset-bundle and widget for dragula drag and drop library

image

e-frank/yii2-dragula

asset-bundle and widget for dragula drag and drop library

  • Monday, February 1, 2016
  • by eFrank
  • Repository
  • 1 Watchers
  • 0 Stars
  • 750 Installations
  • PHP
  • 0 Dependents
  • 0 Suggesters
  • 1 Forks
  • 0 Open issues
  • 1 Versions
  • 22 % Grown

The README.md

yii2-dragula

yii2 extension / widget for dragula drag and drop library, (*1)

does not require any other libraries than dragula., (*2)

for a detailed documentation and demo see Dragula example page, (*3)

configuration options

  1. 'containers': either array of strings containing the ids of the HTML containers or a JsExpression containing the javascript code for the selector
  2. 'options': array of dragula configuration options, see Dragula example page or Dragula on gihub
  3. events
    1. 'drag': JsExpression javascript function function (el) { ... }
    2. 'drop': JsExpression javascript function function (el) { ... }
    3. 'over': JsExpression javascript function function (el, container) { ... }
    4. 'out': JsExpression javascript function function (el, container) { ... }

example / usage

1. HTML container for drag and drop items

<ul id="files">
    <li data-filename="file 1">file 1</li>
    <li data-filename="file 2">file 2</li>
    <li data-filename="file 3">file 3</li>
</ul>

2. Call widget

<?= \x1\dragula\Dragula::widget([
    'containers' => ['#files'],
    'options'    => [
        'revertOnSpill' => true,
    ],
    'drop' => new \yii\web\JsExpression('my.dropped'),
]); ?>

3. Javascript for handling drop event



Note that i used jquery in my example code, which is optional and not referenced by this project., (*4)

Also, you have to take care of script loading order yourself!, (*5)

The Versions

01/02 2016

dev-master

9999999-dev

asset-bundle and widget for dragula drag and drop library

  Sources   Download

BSD-3-Clause

The Requires

  • bower-asset/dragula *

 

yii2 javascript drag drop drag and drop dragula