Sorting of flexforms (e.g. media element)
is done with scriptaculous. The jQuery UI
sortable functionality is a drop-in replacement
already in use for IRRE sorting.
The patch replaces the scriptaculous code
with jQuery UI sortable.
Releases: master
Resolves: #62985
Change-Id: I8655cd2cc0004dc366ebb77b31f5e686dedaf74a
Reviewed-on: http://review.typo3.org/34206
Reviewed-by: Sebastian Fischer <typo3@evoweb.de>
Reviewed-by: Anja Leichsenring <aleichsenring@ab-softlab.de>
Tested-by: Anja Leichsenring <aleichsenring@ab-softlab.de>
Reviewed-by: Oliver Hader <oliver.hader@typo3.org>
Tested-by: Oliver Hader <oliver.hader@typo3.org>
if ($mayRestructureFlexforms) {
$ctrlHeader .= '<div class="pull-right">'
- . IconUtility::getSpriteIcon('actions-move-move', array('title' => 'Drag to Move'))
+ . IconUtility::getSpriteIcon('actions-move-move', array('title' => 'Drag to Move', 'class' => 't3-js-sortable-handle'))
. IconUtility::getSpriteIcon('actions-edit-delete', array('title' => 'Delete', 'class' => 't3-delete'))
. '</div>';
}
};
- // Create sortables for flexform sections
+ /**
+ * Allow flexform sections to be sorted
+ */
TYPO3.FormEngine.FlexFormElement.prototype.createSortable = function() {
var me = this;
- // @todo: use something else than scriptaculous sortable
- Position.includeScrollOffsets = true;
- Sortable.create(me.options.flexformId, {
- tag: 'div',
- constraint: false,
- handle: me.options.sectionHeaderSelector.replace(/\./, ''),
- onChange: function() {
- me.setActionStatus();
- }
+ require(['jquery-ui/sortable'], function () {
+ me.$el.sortable({
+ containment: 'parent',
+ handle: '.t3-js-sortable-handle',
+ axis: 'y',
+ tolerance: 'pointer',
+ stop: function () {
+ me.setActionStatus();
+ }
+ });
});
};