GWT CellList Drag and Drop

[Jee]

Hi,

We would like to replace the old table inside Menu to use cellList.
However, we

don't know whether GWT cellList support drag and drop or not. Drag and
drop is

supported using old table inside Menu but we have to make sure this
feature

still works in cellList before we can replace it.


Thanks,
Jee

[Julien Dramaix]

You can use the drag-and-drop plugins of gqtquery to enbale drag and
drop on any CellWidget.

Example : http://gwtquery-plugins.googlecode.com/svn/trunk/droppable/demo/ContactCellSample/ContactCellSample.html
Documentation : http://code.google.com/p/gwtquery-plugins/wiki/DragAndDropPluginForGWTDeveloppers#The_cell_widgets

Julien

[John LaBanca]

GWT's mobilewebapp sample has an example of drag and drop from a CellList.  As of GWT 2.4, Cells can consume drag and drop events.

Code:

http://code.google.com/p/google-web-toolkit/source/browse/trunk/samples/mobilewebapp/src/main/com/google/gwt/sample/mobilewebapp/client/desktop/DesktopTaskEditView.java

Demo:

http://gwt-cloudtasks.appspot.com/#TaskEditPlace:create

Demo Instructions:

1. Login to the app at the above URL
2. Repast the URL into the address bar (login redirect is broken in the sample at the moment, so you go to a blank page)
3. Drag one of the items from the CellList on the right into the form

Thanks,
John LaBanca
jlab...@google.com

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To post to this group, send email to google-we...@googlegroups.com.
To unsubscribe from this group, send email to google-web-tool...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.

[Jee]

Hi Julien,

thanks.
Its great to see your reply. CellList is supporting drag and drop.
but i am looking within CellList whether drag and drop is supporting
or not.
I tried to get about it, but i still failed.
Please suggest on this.

Thanks
Jee

On May 27, 6:47 pm, Julien Dramaix <julien.dram...@gmail.com> wrote:
> You can use the drag-and-drop plugins of gqtquery to enbale drag and
> drop on any CellWidget.
>

> Example :http://gwtquery-plugins.googlecode.com/svn/trunk/droppable/demo/Conta...
> Documentation :http://code.google.com/p/gwtquery-plugins/wiki/DragAndDropPluginForGW...

[Julien Dramaix]

Could you explain more what you are looking for ? What do you mean by
"within CellList" ?

[Jee]

Can we re-order CellList .. using DND. If we have 5 items in the
CellList, can we move 2nd item to 5th Item in the same CellList.

Thanks
Jee

[Julien Dramaix]

Yes you can...
I wrote an example on how to use gwtquery drag-and-drop plugin for
implementing re-ordering in CellList :

Example : http://julien-labs.googlecode.com/svn-history/r7/trunk/sortablecellwidget/demo/SortableCellList/sortablecelllist.html

Java code : http://code.google.com/p/julien-labs/source/browse/trunk/sortablecellwidget/?r=7#sortablecellwidget%2Fsrc%2Fjulien%2Fsamples%2Fdndcellwidget%2Fclient

The code is documented and easy to understand. If I found time, I will
write an article about how to implement reordering in CellWidget...

Julien

[Jee]

Thanks.
I tried to implement you given example in eclipse Helios.
But i got errors in SortableCellDragAndDropHandler Class
Please guide to solve problems

1.$(draggedCell).css(CSS.DISPLAY.with(Display.NONE)); --- The method
with(Style.Display) is undefined for the type DisplayProperty

2.$(draggedCell).css(CSS.DISPLAY.with(Display.BLOCK)); ---- The
method with(Style.Display) is undefined for the type DisplayProperty

3.allCells.isEmpty() --- The method isEmpty() is undefined for the
type GQuery

public void onDragStart(DragStartEvent event) {
Element draggedCell = event.getDraggable();
$(draggedCell).css(CSS.DISPLAY.with(Display.NONE));
}

public void onDragStop(DragStopEvent event) {
Element draggedCell = event.getDraggable();
$(draggedCell).css(CSS.DISPLAY.with(Display.BLOCK));

}


if (allCells.isEmpty()) {
// no cells, the placeholder should just be added in the begin
of the cell
// list
return null;
}



Thanks
Jee

On May 30, 2:18 pm, Julien Dramaix <julien.dram...@gmail.com> wrote:
> Yes you can...
> I wrote an example on how to use gwtquery drag-and-drop plugin for
> implementing re-ordering in CellList :
>

> Example :http://julien-labs.googlecode.com/svn-history/r7/trunk/sortablecellwi...
>
> Java code :http://code.google.com/p/julien-labs/source/browse/trunk/sortablecell...

[Julien Dramaix]

You are using an old version of gwtquery.

Download the last stable version of GwtQuery compatible with the gwt
version you are using : http://code.google.com/p/gwtquery/wiki/Downloads
The last version of the draggable plugin :
http://code.google.com/p/gwtquery-plugins/downloads/detail?name=draggable-plugin-1.0.4.jar
The last version of the droppable plugin compliant with the gwt
version you are using :
- for gwt 2.2 : http://code.google.com/p/gwtquery-plugins/downloads/detail?name=droppable-plugin-1.0.5.jar
- for gwt 2.3 : http://code.google.com/p/gwtquery-plugins/downloads/detail?name=droppable-plugin-1.0.6.jar

Put these 3 jars in your classpath and it's should work.

Julien

> > > For more options, visit this group athttp://groups.google.com/group/google-web-toolkit?hl=en.- Hide quoted text -
>
> - Show quoted text -

[Jee]

Below jars are being used.But facing the issue with "WITH"

gquery-dnd-bundle-1.0.3
gwtquery-1.0.0-2.3.0
droppable-plugin-1.0.6
gwt 2.3



$(draggedCell).css(CSS.DISPLAY.with(Display.NONE));

$(draggedCell).css(CSS.DISPLAY.with(Display.BLOCK));

please let us know how to proceed.

Thanks
Jee

On May 31, 5:24 pm, Julien Dramaix <julien.dram...@gmail.com> wrote:
> You are using an old version of gwtquery.
>
> Download the last stable version of GwtQuery compatible with the gwt
> version you are using :http://code.google.com/p/gwtquery/wiki/Downloads

> The last version of the draggable plugin :http://code.google.com/p/gwtquery-plugins/downloads/detail?name=dragg...

> The last version of the droppable plugin compliant with the gwt
> version you are using :

>      - for gwt 2.2 :http://code.google.com/p/gwtquery-plugins/downloads/detail?name=dropp...
>      - for gwt 2.3 :http://code.google.com/p/gwtquery-plugins/downloads/detail?name=dropp...

> > > > For more options, visit this group athttp://groups.google.com/group/google-web-toolkit?hl=en.-Hide quoted text -

[icamts]

Hi,
add draggable-plugin-1.0.4, remove gquery-dnd-bundle-1.0.3. If you're
not using Maven move droppable-plugin-1.0.6 before gwt 2.3 library in
compilation order. Hope it helps.

Cheers,
Luca

> > > > > For more options, visit this group athttp://groups.google.com/group/google-web-toolkit?hl=en.-Hidequoted text -

[Jee]

Hi,

Its working fine now. Because i have missed one jar file in class
path.
If you have time, please create an article about CellList re-order.


Thanks
Jee

> > > > > > For more options, visit this group athttp://groups.google.com/group/google-web-toolkit?hl=en.-Hidequotedtext -