https://github.com/oppara/cakephp-plugin-sortable
CakePHP plugin that mainly for jQuery UI Sortable
https://github.com/oppara/cakephp-plugin-sortable
cakephp3 plugin
Last synced: about 1 month ago
JSON representation
CakePHP plugin that mainly for jQuery UI Sortable
- Host: GitHub
- URL: https://github.com/oppara/cakephp-plugin-sortable
- Owner: oppara
- Created: 2017-12-17T16:04:35.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2018-02-16T01:03:47.000Z (about 8 years ago)
- Last Synced: 2025-10-11T22:23:04.244Z (5 months ago)
- Topics: cakephp3, plugin
- Language: PHP
- Size: 11.7 KB
- Stars: 1
- Watchers: 2
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# CakePHP plugin that mainly for [jQuery UI Sortable](https://jqueryui.com/sortable/)
[](https://travis-ci.org/oppara/cakephp-plugin-sortable)
[](https://codecov.io/gh/oppara/cakephp-plugin-sortable)
## Installation
```
composer require oppara/cakephp-plugin-sortable
```
## Enable plugin
```php
// config/bootstrap.php
addBehavior('Sortable.Sortable', [
'condition_fields' => ['user_id']
]);
}
```
```php
// src/Controller/ArticlesController.php
class ArticlesController extends AppController
{
public function sort()
{
if (!$this->request->is('ajax')) {
exit;
}
$data = json_encode($this->request->getData());
$this->log(__METHOD__ . ' data:' . $data, LOG_DEBUG);
$id = $this->request->getData('id');
$new_order = $this->request->getData('display_order');
$this->Sections->sort($id, $new_order);
return $this->response->withType('application/json')
->withStringBody(json_encode(['status' => 'OK']));
}
```
```php
// src/Template/Articles/index.ctp
$this->Html->css(['sort'], ['block' => true]);
$this->Html->script(['jquery-ui.min', 'sort'], ['block' => true]);
title
Actions
= h($article->title) ?>
= $this->Html->link('View', ['action' => 'view', $article->id], ['class' => 'btn btn-info btn-sm']) ?>
= $this->Html->link('Edit', ['action' => 'edit', $article->id], ['class' => 'btn btn-info btn-sm']) ?>
```
```javascript
// src/webroot/sort.js
$(function(){
$('.sortable').sortable({
items: 'tbody tr:not(.ui-sort-disabled)',
axis: 'y',
placeholder: 'ui-state-highlight',
cursor: 'row-resize',
handle: '.handle',
opacity: 0.5,
start: function(e, ui) {
var tableWidth = $(this).width(),
cells = ui.item.children('td'),
widthForEachCell = tableWidth / cells.length + 'px';
cells.css('width', widthForEachCell);
},
update: function(e, ui) {
var item = ui.item,
item_data = item.data();
var params = {
id: item_data.id,
display_order: item.index()
};
$.ajax({
type: 'POST',
url: item_data.url,
dataType: 'json',
data: params,
cache: false
}).fail(function() {
alert ('ERROR!');
});
}
});
});
```