Drag/Drop between comboBoxItem not working

[satya_paul]

Smartclient version: v10.0p_2015-06-17/Enterprise Deployment

We have recently upgraded to 10.0 from 8.2. After upgrading, we are facing Drag/Drop issue between two comboBoxItem.

We have a dynamic form which contains two comboBoxItem, after typing a keyword and selecting the typed keyword in one combox, we are unable to drag/drop it to another comboxBox. I have replicated the issue in smartclient development environment. This isssue is not present when we use smartclient 8.2.
Below is the code I used to replicate the issue in smartclient development environment.

Note: Try to drag/drop a keyword(after selecting the whole keyword) from producer to combobox.

var basicSearchForm = isc.DynamicForm.create({
ID: "basicSearchForm",
numCols:6,
width:200,
colWidths:[1,1,200,1,1,1],
cellBorder:0,
itemKeyPress:"if (keyName == "Enter") basicButtonSubmit.click()",
titleOrientation:"left",

show: function() {

},
items:[
{
_constructor:"RowSpacerItem",
startRow:true
},
{
ID:"Producer",
name:"Producer",
title:"Producer",
selectOnFocus:true,
_constructor:"ComboBoxItem",
valueField: "Key",
displayField: "Name",
// optionDataSource: List_DS,
pickListHeight: 200,
autoFetchData:false,
showOptionsFromDataSource:true,
pickListProperties : { dataProperties : { fetchDelay: 500} },
width:300,
colSpan:1,
length:100
},
{
ID:"Consumer",
name:"Consumer",
title:"Consumer",
selectOnFocus:true,
_constructor:"ComboBoxItem",
editorType: "comboBox",
valueField: "Key",
displayField: "Name",
// optionDataSource: List_DS,
pickListHeight: 200,
autoFetchData:false,
startRow:true,
showOptionsFromDataSource:true,
pickListProperties : { dataProperties : { fetchDelay: 500} },
width:300,
colSpan:1,
length:100
}
]});

var basicSearchFormHLayout = isc.HLayout.create({
name: "basicSearchFormHLayout",
width:"100%",
layoutTopMargin:20,
members:[
isc.VLayout.create({
ID:"basicSearchFormVLayout",
padding:5,
autoDraw:false,
showEdges:true,
edgeSize:1,
backgroundColor:"#FFFFFF",
members:[
isc.Label.create({
contents:"test",

padding:5,
height:1,
width:400
}),
//changeSearch_LinkLabel,
basicSearchForm
]
})

]
});

var basicSearch_VLayout = isc.VLayout.create({
name: "basicSearch_VLayout",
width:"100%",
members:[
basicSearchFormHLayout
]
});

var RouteCentral_VLayout = function() {

var newCentralLayout, searchForm;
newCentralLayout = isc.VLayout.create({
name:"routeCentral_VLayout",
members:[
basicSearch_VLayout,
]
});
}

var routeCentral_VLayout = new RouteCentral_VLayout();
var Search_VLayout = isc.VLayout.create({
name:"Search_VLayout",
showEdges:false,

margin:5,
members:[

routeCentral_VLayout
]
});

var routeMain_HLayout = isc.HLayout.create({
name:"routeMain_HLayout",
//autoDraw:false,
members:[
Search_VLayout
],
});

function showBasicLayout() {
basicSearch_VLayout.show();
}


Can you please take a look at this issue?

[Isomorphic]

We have a developer queued up to take a look. We'll let you know what we find.

Thanks
Isomorphic Software

[Isomorphic]

A couple of clarifications: 1. Are you talking about the browser native drag and drop of selected text (normally present with just a plain HTML form), or a SmartClient drag and drop behavior? 2. What browser(s) are you seeing this problem on? 3. Do you see this problem on the latest patched build of 10.0p? 4. Are you seeing this on any other controls? Because your test case involves an invalidly configured ComboBoxItem (no optionDataSource is provided and no valueMap)

[satya_paul]

1. It's smartclient drag and drop issue with comboBox. In smartclient 8.2, it's working fine but in 10.0 it's not working.

2. We are able to replicate this issue using smartclient(v10.0p_2015-10-25) development environment on IE(8,9,10,11) and mozilla firefox. Also, this issue is not present using same browser with smartclient 8.2.

3. In our application, we are using optionDataSource to get the values for comboBoxItem. For replicating this issue on smartclient development environment, we have commented out the optionDataSource field.

Below is the modified code(added valueMap for combobox) we have used to replicate the issue in smartclient develpoment kit. We are unable to drag Test1 or Test2 values from Producer comboBox to Consumer comboBox.

var basicSearchForm = isc.DynamicForm.create({
//autoShow:true,
ID: "Search_basicSearchForm",
//autoDraw:false,
numCols:6,
width:200,
colWidths:[1,1,200,1,1,1],
cellBorder:0,
//saveOnEnter:true,
itemKeyPress:"if (keyName == "Enter") basicButtonSubmit.click()",
titleOrientation:"left",

show: function() {
//this.getField("bsfProducer").fetchData();
},
items:[
{
_constructor:"RowSpacerItem",
startRow:true
},
{
ID:"bsfProducer",
name:"bsfProducer",
title:"Producer",
selectOnFocus:true,
_constructor:"ComboBoxItem",
// prompt: helpTextRouteSearchModule.bsfProducer,
valueField: "OrganizationKey",
displayField: "OrganizationName",
// optionDataSource: partnerList_DS,
pickListHeight: 200,
autoFetchData:false,
showOptionsFromDataSource:true,
pickListProperties : { dataProperties : { fetchDelay: 500} },
width:300,
colSpan:1,
length:100,
valueMap: {
TEST1: "Test1",
TEST2: "Test2",
}
},
{
ID:"bsfConsumer",
name:"bsfConsumer",
title:"Consumer",
selectOnFocus:true,
_constructor:"ComboBoxItem",
editorType: "comboBox",
//prompt: helpTextRouteSearchModule.bsfConsumer,
valueField: "OrganizationKey",
displayField: "OrganizationName",
// optionDataSource: partnerList_DS,
pickListHeight: 200,
autoFetchData:false,
startRow:true,
showOptionsFromDataSource:true,
pickListProperties : { dataProperties : { fetchDelay: 500} },
width:300,
colSpan:1,
length:100,
valueMap: {
TEST3: "Test3",
TEST4: "Test4",
}

}
]});

var basicSearchFormHLayout = isc.HLayout.create({
name: "basicSearchFormHLayout",
width:"100%",
layoutTopMargin:20,
// autoDraw:false,
//autoShow:true,
members:[
isc.VLayout.create({
ID:"basicSearchFormVLayout",
padding:5,
autoDraw:false,
showEdges:true,
edgeSize:1,
backgroundColor:"#FFFFFF",
members:[
isc.Label.create({
//contents:"<b>Select Partners and Groups to Associate</b><br>Select (or SHIFT/CTRL+Select) partners and a group to begin association.",
contents:"test",
// iconHeight:23,
// iconWidth:42,
padding:5,
height:1,
width:400
}),
//changeSearch_LinkLabel,
basicSearchForm
]
})

]
});

var basicSearch_VLayout = isc.VLayout.create({
name: "basicSearch_VLayout",
// autoDraw:false,
width:"100%",
members:[
// searchButtons_Toolbar,
basicSearchFormHLayout
]
});

var RouteCentral_VLayout = function() {

var newCentralLayout, searchForm;
newCentralLayout = isc.VLayout.create({
name:"routeCentral_VLayout",
//autoDraw:false,
members:[
basicSearch_VLayout,
// advancedSearch_VLayout
]
});
}

var routeCentral_VLayout = new RouteCentral_VLayout();
var Search_VLayout = isc.VLayout.create({
name:"Search_VLayout",
//autoShow:true,
// autoDraw:false,
showEdges:false,
//padding:5,
margin:5,
members:[
// search_TabSet
routeCentral_VLayout
]
});

var routeMain_HLayout = isc.HLayout.create({
name:"routeMain_HLayout",
//autoDraw:false,
members:[
Search_VLayout
],
});

function showBasicLayout() {
basicSearch_VLayout.show();
}

[Isomorphic]

Thanks for the test case. We're taking a look and we'll get back to you soon

Regards
Isomorphic Software

[Isomorphic]

We've made a change to address this issue. Please try the next nightly build, dated Nov 5 or above

Regards
Isomorphic Software

[satya_paul]

Looks like Nov 5 build is not avaialble rite now. We have downloaded currently available build "SmartClient_v100p_2015-10-31_Enterprise".
Can you please let us know when you will be uploading the Nov 5 or above nightly build?

[Isomorphic]

The answer is really "ASAP" :)
We're aware that nightly builds are not being uploaded and have people working on this. Normal service should resume soon, but we don't have a concrete ETA.

[satya_paul]

We have downloaded the latest build "SmartClient_v100p_2015-11-17_Enterprise" and tested it in our application but the issue is still present. Also, we are able to reproduce this issue in smartclient development environment with latest build i.e "SmartClient_v100p_2015-11-17_Enterprise". Looks like this issue has not been resolved.
In IE8, same code is working fine and we are able to drag and drop between combobox item but it other IE versions and mozilla it's not working.
Due to this issue, we are stuck with our smartclient upgrade project.
Can you please take a look into it ASAP?

[Isomorphic]

Strange - we'll take a look and let you know what we find.

[Isomorphic]

Well - we retested and we're not seeing a problem here.

However the test code from #4 has some issues and this may be confusing your testing. (We possibly should have mentioned this earlier)

There are some small syntax errors (a couple of trailing commas and the "itemKeyPress" handler string terminates too early as double-quotes are used for both the whole string and the "Enter" key-name within it). More importantly though, the attempted nesting of components isn't being handled correctly - this line:

var routeCentral_VLayout = new RouteCentral_VLayout();

...is clearly attempting to pick up the VLayout created by that RouteCentral_VLayout() method, but the syntax is wrong if that is the goal. Instead the routeCentral_VLayout variable gets set to basically an empty object.
The result is that the "members" property of the "Search_VLayout" component gets set to an array containing an empty object, which it automatically expands into a Canvas.

Ultimately what you get is the real routeCentral_Vlayout, containing the desired UI being rendered out on the page, and also at coordinates 0,0, there's some additional UI - the routeMain_HLayout, which contains Search_Vlayout, which contains an unmodified Canvas.
The additional UI partially covers the top ComboBoxItem's text-box, meaning it interferes with the mouse events.

If you remove it (simply comment out the Search_VLayout and the routeMain_HLayout) in this test case then things work (at least for us).

As an aside - the "watch" tab of the developer console is useful for figuring out what's actually rendered on the page and avoiding this kind of mistake.

Anyway - with the build you cite, we are able to drag text from the top comboBox to the bottom one in both IE10 and Firefox [version 42].
We're testing this on Windows 7.

If you do continue to see the problem, please let us know what OS you're testing on, and perhaps show us a revised test case, and we'll repeat the test on that OS.

Regards
Isomorphic Software