Related posts:

1. Is your extension compatible with TYPO3 4.6 ?
2. TYPO3 extension: Google Web Font Loader
3. How to make a brand hated, with newsletters

For start we need jQuery, ui.core and ui.sortable, make sure you download them and include them in the header of your application:

<script src=”jquery-latest.js”></script>
<script src=”ui.core.js”></script>
<script src=”ui.sortable.js”></script>

after that we use this little code snippet to make the magic:

<script>

$(document).ready(function(){

$(“.thelist”).sortable({

cursor: ‘.handle’,

update : function () {

serial=$(‘.thelist’).sortable(‘serialize’,'id’);

$(“#target”).load(“load.php”, { list: serial } );

}

});

});

</script>

In the html we have a div with the class thelist, this is the div that contains the sortable elements, each having a unique id.

<div class=”thelist”>

<div class=”divo” id=”el_1″>Item 1</div>

<div class=”divo” id=”el_2″>Item 2</div>

<div class=”divo” id=”el_3″>Item 3</div>

<div class=”divo” id=”el_4″>Item 4</div>

<div class=”divo” id=”el_5″>Item 5</div>

</div>

After each drag and drop operation in load.php will receive a string with the order of the divs, the result will be something like this:

el[]=3&el[]=4&el[]=5&el[]=2&el[]=1

This data is sent to load.php with POST, beeing contained in the list variable: $_POST['list']

This is only a basic demonstration, you can do much advanced functionality with jQuery Sortable, you just need a little time and a little coffee.

Related posts:

1. MySQL – Sort results in order by list
2. How to build a clickmap using PHP and jQuery
3. 6 books for developers working with Drupal 6 and Jquery

• Record the X and Y coordinates of the mouse cursor when it is clicked on a web page.
• Save those coordinates to a database
• When called, display a “clickmap” on top of the web page visually displaying the locations of those clicks.

The results are amazing, check it out here. This thing could be used to track clicks in any webpage and use this stuff in marketing or usability studies.

Related posts:

1. How to make a drag and drop sorted list with jQuery Sortable
2. 6 books for developers working with Drupal 6 and Jquery
3. How to generate PDF files dynamically using PHP and Haru

“When it comes to working with different file formats, PHP is like a Swiss Army knife: it has a tool to handle almost anything you can throw at it. JPEG images, XML files, Word documents, ZIP archives…you name it, and there’s a PHP extension to handle it!”

Related posts:

1. Importing large files into a MySQL database
2. Enabling PHP file uploads in TYPO3 Backend
3. Critical security issue in Typo3 core – all versions