Drag Drop: How can I know what panel was dragged inside a drop zone ?
Fri, 12/16/2011 - 18:21
Hello,
I'm trying to implement drag&drop functionality, but no success.
I have 2 dragable panels and 1 drop zone. When I drag a panel inside a drop zone, how can I know what panel was dragged inside the drop zone ?
See the example below.
Thanks in advance
DemoDragDrop.php
<?php
require('qcubed.inc.php');
class DemoDragDrop extends QForm {
protected $pnlDrag1;
protected $pnlDrag2;
protected $pnlDrop;
protected function Form_Create() {
$this->pnlDrop = new QPanel($this, 'pnlDrop');
$this->pnlDrop->Text = 'pnlDrop';
$this->pnlDrop->Width = '400';
$this->pnlDrop->Height = '300';
$this->pnlDrop->SetCustomStyle('border', '1px solid blue');
$this->pnlDrop->AddAction(new QDragDropEvent(), new QAjaxAction('pnlDrop_Drop'));
$this->pnlDrag1 = new QPanel($this, 'pnlDrag1');
$this->pnlDrag1->Text = 'pnlDrag1';
$this->pnlDrag1->Width = '120';
$this->pnlDrag1->Height = '70';
$this->pnlDrag1->SetCustomStyle('border', '1px solid red');
$this->pnlDrag1->ActionParameter = 'pnlDrag1';
$this->pnlDrag1->AddControlToMove($this->pnlDrag1);
$this->pnlDrag1->RemoveAllDropZones();
$this->pnlDrag1->AddDropZone($this->pnlDrop);
$this->pnlDrag2 = new QPanel($this, 'pnlDrag2');
$this->pnlDrag2->Text = 'pnlDrag2';
$this->pnlDrag2->Width = '120';
$this->pnlDrag2->Height = '70';
$this->pnlDrag2->SetCustomStyle('border', '1px solid green');
$this->pnlDrag2->ActionParameter = 'pnlDrag2';
$this->pnlDrag2->AddControlToMove($this->pnlDrag2);
$this->pnlDrag2->RemoveAllDropZones();
$this->pnlDrag2->AddDropZone($this->pnlDrop);
}
protected function pnlDrop_Drop($strFormId, $strControlId, $strParameter) {
QApplication::DisplayAlert('$strFormId: ' . $strFormId . ' | $strControlId: ' . $strControlId . ' | $strParameter: ' . $strParameter);
}
}
DemoDragDrop::Run('DemoDragDrop');
?>DemoDragDrop.tpl.php
<?php require('includes/configuration/header.inc.php'); ?>
<?php $this->RenderBegin(); ?>
<table border="0" cellspacing="20">
<tr>
<td><?php $this->pnlDrag1->Render() ?></td>
<td rowspan="2"><?php $this->pnlDrop->Render() ?></td>
</tr>
<tr>
<td><?php $this->pnlDrag2->Render() ?></td>
</tr>
</table>
<?php $this->RenderEnd(); ?>
<?php require('includes/configuration/footer.inc.php'); ?>PS: Sorry for my english.
I recommend implementing Drag and Drop and any other advanced Javascript functionality by using jQuery wrappers. Take a look at this example: http://examples.qcu.be/assets/_core/php/examples/other_controls/jq_examp...
You'll see at the very top of the example that you can drag a control onto a droppable area, and the popup identifies the ID of the control that was dropped easily.
Let me know if this helps.
Thanks Alex!
This is exactly what I was looking for.
Best regards,
Julio.
Hello Alex,
I'm trying to implement drag & drop, as in the example page, but I'm getting the error
I am using a fresh installation of QCubed 2.0.2, and tests with the code copied from the example jq_example.php in QCubed's site.
The same example exists in the downloaded package has a completely different code, using QDraggable rather than QPanel, and does not capture the object ID, only showing that something was dragged to the object.
Hang tight... The examples site is running the latest version from the trunk. Release is imminent, get the new bits, and it'll all be better :)
Alex, I am sorry but I am a bit worried about this.
I do not remember what all changes I did make into my apps (I think I changed some core files as well, back when I did not had the idea that I could just create a new class and do the tinkering over there. Anyway, I think I would still do a test upgrade and see if too many things break down. If they don't, I wouldn't mind putting in a little more extra effort to get the update.
But in case thing do break down and I want some of the core functionality upgraded, I would like to manually apply patches by downloading them from the trac. I, however am badly confused with the 'versions' shown in the list of issues. Can you clarify a bit? It will help me immensely :|
Regards
Ok, thanks.
I'll waiting for the new release.