Drag a tree grid row from any cell

Develop and Deploy Cross-Browser Web Apps .

Drag a tree grid row from any cell

Postby torkos » Fri Jan 23, 2015 4:51 am

I have two tree grids that I want to be able to swap data between by dragging and dropping. Im finding that I can drag rows when I select the first cell of that row. When I try to drag from a cell in the middle of the row, I can select the cell but not the whole row. Do I have to do something special to drag a row of a tree grid by clicking anywhere in the tree grid?
torkos
 
Posts: 9
Joined: Thu Jan 22, 2015 1:35 pm

Re: Drag a tree grid row from any cell

Postby support » Fri Jan 23, 2015 6:20 am

Before the UI was rendered, add this line:

javascript code
xui.UI.TreeGrid._draggable("CELLS");


Example:

   
Class('App', 'xui.Com',{
Instance:{
iniComponents : function(){
// [[Code created by CrossUI RAD Studio
var host=this, children=[], append=function(child){children.push(child.get(0));};

append(
(new xui.UI.Pane())
.setHost(host,"ctl_pane6")
.setLeft(30)
.setTop(40)
.setWidth(280)
.setHeight(200)
);

host.ctl_pane6.append(
(new xui.UI.TreeGrid())
.setHost(host,"ctl_treegrid2")
.setRowNumbered(true)
.setHeader([{
"id" : "col1",
"width" : 80,
"type" : "input",
"caption" : "col1"
},{
"id" : "col2",
"width" : 80,
"type" : "input",
"caption" : "col2"
},{
"id" : "col3",
"width" : 80,
"type" : "input",
"caption" : "col3"
},{
"id" : "col4",
"width" : 80,
"type" : "input",
"caption" : "col4"
}])
.setRows([{
"cells" : [{
"value" : "row1 col1"
},{
"value" : "row1 col2"
},{
"value" : "row1 col3"
},{
"value" : "row1 col4"
}]
},{
"cells" : [{
"value" : "row2 col1"
},{
"value" : "row2 col2"
},{
"value" : "row2 col3"
},{
"value" : "row2 col4"
}]
},{
"cells" : [{
"value" : "row3 col1"
},{
"value" : "row3 col2"
},{
"value" : "row3 col3"
},{
"value" : "row3 col4"
}],
"sub" : [{
"cells" : ["sub1","sub2","sub3","sub4"]
}]
}])
.setDropKeys("aaa")
.setDragKey("aaa")
);

append(
(new xui.UI.Pane())
.setHost(host,"ctl_pane8")
.setLeft(330)
.setTop(40)
.setWidth(280)
.setHeight(200)
);

host.ctl_pane8.append(
(new xui.UI.TreeGrid())
.setHost(host,"ctl_treegrid4")
.setRowNumbered(true)
.setHeader([{
"id" : "col1",
"width" : 80,
"type" : "input",
"caption" : "col1"
},{
"id" : "col2",
"width" : 80,
"type" : "input",
"caption" : "col2"
},{
"id" : "col3",
"width" : 80,
"type" : "input",
"caption" : "col3"
},{
"id" : "col4",
"width" : 80,
"type" : "input",
"caption" : "col4"
}])
.setRows([{
"cells" : [{
"value" : "row1 col1"
},{
"value" : "row1 col2"
},{
"value" : "row1 col3"
},{
"value" : "row1 col4"
}]
},{
"cells" : [{
"value" : "row2 col1"
},{
"value" : "row2 col2"
},{
"value" : "row2 col3"
},{
"value" : "row2 col4"
}]
},{
"cells" : [{
"value" : "row3 col1"
},{
"value" : "row3 col2"
},{
"value" : "row3 col3"
},{
"value" : "row3 col4"
}],
"sub" : [{
"cells" : ["sub1","sub2","sub3","sub4"]
}]
}])
.setDropKeys("aaa")
.setDragKey("aaa")
);

return children;
// ]]Code created by CrossUI RAD Studio
},
events:{
"onReady" : "_com_onReady"
},
_com_onReady:function (com, threadid){
xui.UI.TreeGrid._draggable("CELLS");
}
}
});
   
support
 
Posts: 352
Joined: Sat Apr 27, 2013 9:22 am

Re: Drag a tree grid row from any cell

Postby torkos » Wed Jan 28, 2015 6:15 am

Thank you. I tried the code and it works.
torkos
 
Posts: 9
Joined: Thu Jan 22, 2015 1:35 pm


Return to CrossUI for Web Apps

Who is online

Users browsing this forum: No registered users and 0 guests

cron