Using custom view with a custom template to display your own HTML and even enable drag and drop. Agile Toolkit helps you even if you build your own components. Here we also specify a custom JavaScript which uses univ().ajaxec() to send data back to the server.
Hello.

Person: John (id: 1)

Drag tasks into me!

Person: Peter (id: 2)

Drag tasks into me!

Person: Jojo (id: 3)

Drag tasks into me!

Person: Kevin (id: 4)

Drag tasks into me!

Task: Write Report (id:3)

Drag me!

Allocated To:

Task: Wash Dishes (id:6)

Drag me!

Allocated To:

Task: Submit Taxes (id:8)

Drag me!

Allocated To:

Source of lib/PersonList.php
CommentLinkCopy
<?php
class PersonList extends CompleteLister {
}
Source of lib/TaskList.php
CommentLinkCopy
<?php
class TaskList extends CompleteLister {
	function formatRow(){
		$id=$this->current_id;


		$this->current_row['allocated']=print_r($this->owner->allocated[$id],true);
	}
}
Source of templates/default/page/dragaction.html
CommentLinkCopy
<div id="<?$_name?>">

<?$Content?>

Hello. 
<table width="100%">
	<tr><td width="50%">
		<?People?>
		<div id="<?$_name?>" style="border-right: 1px dashed black">
			<?rows?><?row?>
			<div data-id="<?$id?>" id="<?$_name?>" style="border: 1px solid red; margin: 2em">
				<h4>Person: <?$name?> (id: <?$id?>)</h4>
				<p>Drag tasks into me!</p>

			</div>
			<?/row?><?/rows?>
		</div>
		<?/?>
	</td><td width="50%">
	<?Tasks?>
	<div id="<?$_name?>">
		<?rows?><?row?>
		<div data-id="<?$id?>" id="<?$_name?>" style="border: 1px solid red; margin: 2em">
			<h4>Task: <?$name?> (id:<?$id?>)</h4>
			<p>Drag me!</p>

			<p>Allocated To: <?$allocated?></p>
		</div>
		<?/row?><?/rows?>
	</div>
	<?/?>
</td></tr></table>

<?$Sources?>

</div>
Disqus