PDA

View Full Version : Reorder GroupingStore DND - Malfunction



pes
12 Mar 2012, 2:54 PM
I have a simple grouping store with DND. When I attempt to reorder the grouping store with a DND in the same group it appears to malfunction and does not drop in the correct location. Here is a working example of the problem within a single group. Try to drag item on the last row to a higher position on the Grid. If you remove the grouping view all together (ie setView), the DND works correctly. (GXT 2.2.4)




import com.extjs.gxt.ui.client.widget.Composite;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.layout.AnchorLayout;
import com.extjs.gxt.ui.client.widget.grid.Grid;
import com.extjs.gxt.ui.client.widget.grid.GridGroupRenderer;
import com.extjs.gxt.ui.client.widget.grid.GroupColumnData;
import com.extjs.gxt.ui.client.widget.grid.GroupingView;
import com.extjs.gxt.ui.client.Style.SelectionMode;
import com.extjs.gxt.ui.client.data.BeanModel;
import com.extjs.gxt.ui.client.data.BeanModelFactory;
import com.extjs.gxt.ui.client.data.BeanModelLookup;
import com.extjs.gxt.ui.client.data.BeanModelTag;
import com.extjs.gxt.ui.client.dnd.GridDragSource;
import com.extjs.gxt.ui.client.dnd.GridDropTarget;
import com.extjs.gxt.ui.client.dnd.DND.Feedback;
import com.extjs.gxt.ui.client.event.DNDEvent;
import com.extjs.gxt.ui.client.event.DNDListener;
import com.extjs.gxt.ui.client.store.GroupingStore;
import com.extjs.gxt.ui.client.widget.grid.ColumnModel;
import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;
import com.extjs.gxt.ui.client.widget.layout.AnchorData;
import java.util.ArrayList;
import java.util.List;

public class ReorderGroupingStore extends Composite {


private Grid<BeanModel> grid;
private GroupingStore<BeanModel> groupingStore;
private BeanModelFactory factory = BeanModelLookup.get().getFactory(MyRecord.class);


public ReorderGroupingStore() {
{
ContentPanel contentPanel = new ContentPanel();
contentPanel.setHeading("contentPanel");
contentPanel.setCollapsible(true);
contentPanel.setLayout(new AnchorLayout());
{
List<ColumnConfig> configs = new ArrayList<ColumnConfig>();

{
ColumnConfig column = new ColumnConfig();
column.setMenuDisabled(true);
column.setSortable(false);
column.setResizable(false);
column.setId("name");
column.setWidth(200);
configs.add(column);
}
{
ColumnConfig column = new ColumnConfig();
column.setMenuDisabled(true);
column.setSortable(false);
column.setResizable(false);
column.setId("category");
column.setWidth(50);
configs.add(column);
}

ColumnModel cm = new ColumnModel(configs);

groupingStore = new GroupingStore<BeanModel>();
groupingStore.groupBy("category", true);
GroupingView view = new GroupingView();
view.setShowGroupedColumn(false);
view.setForceFit(true);

view.setGroupRenderer(new GridGroupRenderer() {

public String render(GroupColumnData data) {
return data.group;
}
});

grid = new Grid(groupingStore, cm);
grid.setView(view);

grid.setHideHeaders(true);
grid.setStripeRows(true);
grid.setTrackMouseOver(true);
grid.setAutoExpandColumn("name");
grid.getSelectionModel().setSelectionMode(SelectionMode.SINGLE);
grid.setBorders(true);
grid.setId("grid");

GridDragSource source = new GridDragSource(grid);
GridDropTarget target = new GridDropTarget(grid);
target.addDNDListener(new DNDListener()
{
@Override
public void dragDrop(DNDEvent e) {
}

});


target.setAllowSelfAsSource(true);
target.setFeedback(Feedback.INSERT);

contentPanel.add(grid, new AnchorData("100%"));
grid.setBorders(true);
}

loadData();
initComponent(contentPanel);

}

}


public void loadData(){


MyRecord myRecord1 = new MyRecord("Paul", "Shipping");
BeanModel model1 = factory.createModel(myRecord1);
groupingStore.add(model1);

MyRecord myRecord2 = new MyRecord("Joe", "Shipping");
BeanModel model2 = factory.createModel(myRecord2);
groupingStore.add(model2);

MyRecord myRecord3 = new MyRecord("Jim", "Shipping");
BeanModel model3 = factory.createModel(myRecord3);
groupingStore.add(model3);

MyRecord myRecord4 = new MyRecord("Mike", "Shipping");
BeanModel model4 = factory.createModel(myRecord4);
groupingStore.add(model4);

MyRecord myRecord5 = new MyRecord("Bill", "Shipping");
BeanModel model5 = factory.createModel(myRecord5);
groupingStore.add(model5);

}

public class MyRecord implements BeanModelTag {

private String name;
private String category;

public MyRecord(){
}

public MyRecord(String name, String category){
this.name = name;
this.category = category;
}


public String getCategory() {
return category;
}
public void setCategory(String category) {
this.category = category;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}