Wrong selection visible in paged TreeGrid

[SimonF]

Hi there,

I'm using a paged treegrid and found a display-bug.

If you expand one of the nodes and (left-)click on multiple nodes (without holding ctrl), the selection is not removed. After you scroll above the blue rows only the one node which was really selected is blue.

Also you can see in the gif that after the click on the blue selection jumps to the first node, after moving the cursor the hover jumps on the correct node again.

In the gif the cursor has a yellow circle around and when clicking there is a small red circle. This also happens without this circle.


Here is the code to reproduce

isc.TreeGrid.create({
	"ID" : "theTreeGrid",
	"width" : "100%",
	"height" : "100%",
	"selectionType" : "multiple",
	"canEdit" : false,
	"showFilterEditor" : false,
	dataSource : isc.DataSource.create({
		"fields" :
		[{
				"name" : 'parentId',
				"hidden" : true,
				"rootValue" : '0',
				"foreignKey" : 'id'
			}, {
				"name" : "nameField",
				"title" : "Name",
				"type" : "text"
			}, {
				"name" : "lastField",
				"title" : "gfds",
				"type" : "text"
			}
		],
		"dataFormat" : "json",
		"dataURL" : "http://devset.de/treegrid.php",
		"transformRequest" : requestTransformer,
		"transformResponse" : responseTransformer,
		"recordXPath" : "\/resultData",
		"canReturnOpenFolders" : true,
		"useHttpProxy" : false
	}),
	dataProperties : {
		openProperty : "isOpen",
		childrenProperty : "children"
	},
	"autoFetchData" : true,
	"dataPageSize" : 20,
	"dataFetchMode" : "paged",
	"selectionProperty" : "isSelected",
	"fields" :
	[{
			"name" : "nameField",
			"title" : "Name",
			"type" : "text",
			"canEdit" : false,
			"canSort" : false
		}, {
			"name" : "lastField",
			"title" : "lastFieldName",
			"type" : "text",
			"canEdit" : false,
			"canSort" : false
		}
	]
});
function requestTransformer(dataSourceRequest) {
	var operationType = {
		operationType : dataSourceRequest.operationType
	};
	if (dataSourceRequest.operationType == "fetch") {
		var params = {
			start : dataSourceRequest.startRow,
			end : dataSourceRequest.endRow
		};
	}
	return isc.addProperties({}, operationType, dataSourceRequest.data, params);
}
function responseTransformer(dataSourceResponse, dataSourceRequest, jsonData) {
	if (dataSourceRequest.operationType == "fetch") {
		dataSourceResponse.totalRows = jsonData.totalRows;
		dataSourceResponse.endRow = jsonData.endRow;
		dataSourceResponse.startRow = jsonData.startRow;
	};
}

This is reproducable in all current versions of all browsers and with the latest nightly (SmartClient Pro Edition (2015-03-30 nightly))

Best

[Isomorphic]

Your DataSource definition is broken - it's got a foreignKey to a non-existent field "id".

[SimonF]

Thanks for pointing this out. I have fixed this by adding this to the datasource fields

 {
	"name" : 'id',
	"hidden" : true,
	"primaryKey" : true,
	"canView" : false
}

In our application the primaryKey field has another name. So i have renamed all occurences of the fieldname and renamed it to "treeGridGeneratedIndex", but the name itself doesn't make any change.

If i select a folder which i want to open first, there seems to be no issue

But if i don't select the folder first and click the [+] symbol there seems to be multiple unneeded datasource-requests

After i select the first node which was opened, there also another datasource-request for a non-visible part of the tree, which i think is not needed.

If i click the [+] symbol of the second node, without having anything selected previous, you can see a hover jumping to te first node of the tree


this is the code which leads to this shown result.

isc.TreeGrid.create({
	"ID" : "theTreeGrid",
	"width" : "100%",
	"height" : "100%",
	"selectionType" : "multiple",
	"canEdit" : false,
	"showFilterEditor" : false,
	dataSource : isc.DataSource.create({
		"fields" :
		[{
				"name" : 'parentId',
				"hidden" : true,
				"rootValue" : '0',
				"foreignKey" : 'treeGridGeneratedIndex'
			}, {
				"name" : 'treeGridGeneratedIndex',
				"hidden" : true,
				"primaryKey" : true,
				"canView" : false
			}, {
				"name" : "nameField",
				"title" : "Name",
				"type" : "text"
			}, {
				"name" : "lastField",
				"title" : "gfds",
				"type" : "text"
			}
		],
		"dataFormat" : "json",
		"dataURL" : "http://devset.de/treegrid.php",
		"transformRequest" : requestTransformer,
		"transformResponse" : responseTransformer,
		"recordXPath" : "\/resultData",
		"canReturnOpenFolders" : true,
		"useHttpProxy" : false
	}),
	dataProperties : {
		openProperty : "isOpen",
		childrenProperty : "children"
	},
	"autoFetchData" : true,
	"dataPageSize" : 50,
	"dataFetchMode" : "paged",
	"selectionProperty" : "isSelected",
	"fields" :
	[{
			"name" : "nameField",
			"title" : "Name",
			"type" : "text",
			"canEdit" : false,
			"canSort" : false
		}, {
			"name" : "lastField",
			"title" : "lastFieldName",
			"type" : "text",
			"canEdit" : false,
			"canSort" : false
		}
	]
});
function requestTransformer(dataSourceRequest) {
	var operationType = {
		operationType : dataSourceRequest.operationType
	};
	if (dataSourceRequest.operationType == "fetch") {
		var params = {
			start : dataSourceRequest.startRow,
			end : dataSourceRequest.endRow
		};
	}
	return isc.addProperties({}, operationType, dataSourceRequest.data, params);
}
function responseTransformer(dataSourceResponse, dataSourceRequest, jsonData) {
	if (dataSourceRequest.operationType == "fetch") {
		dataSourceResponse.totalRows = jsonData.totalRows;
		dataSourceResponse.endRow = jsonData.endRow;
		dataSourceResponse.startRow = jsonData.startRow;
	};
}

Did i missed something again?
Best regards

[Isomorphic]

This is reproducable in all current versions of all browsers and with the latest nightly (SmartClient Pro Edition (2015-03-30 nightly))

What branch? SC 9.1p?

[Isomorphic]

We do see the problem, but it looks like it only happens if you move the mouse before the expected fetch is processed. So a workaround is to not move the mouse until the ListGrid updates. Sorry, we were just making a little joke given today - we're looking into the problem.

[SimonF]

thanks for the workaround ;-)

The problem was reproducable with the SC 10.0 branch (SmartClient Pro Edition (2015-03-30 nightly)).
I think it will be also reproducible with the latest nightly, but i can only check that in about 10 hours. If you waiting for this confirmation, it seems the fix for that will delay for another day because of the time difference. Hopefully you can check that issue right away.

[Isomorphic]

We are able to reproduce the issue in the current code stream, so the exact date of the build you're using is not important. We just needed to know the branch you're on because that affects how far back the fix must be ported.

[SimonF]

So all described issues are reproducible on your side, or just the last hover selection issue?
Thanks for the fast response

Best

[Isomorphic]

We're focusing on the multiple unneeded DSRequests at the moment, which I believe was the first issue you reported. If, after that is resolved, we still see any issues, we'll address them.

[Isomorphic]

We've fixed the spurious fetch issue observed for SC 9.1p and newer. The fix should be in the nightly builds available tomorrow morning.

[SimonF]

Thanks, the additional unnecessary datarequests, are now gone in the latest nightly (SmartClient_v100p_2015-04-07_Pro).

Nevertheless i have two other problems which are occuring

1. If you specify a sorting in the TreeGrid this is not included in the first requests. The request for the rootnode doesn't include a sortBy also if you open a folder, there is no sortBy attribute set.
If you begin to scroll, the sortBy attribute is set and the datasource-response, returns a sorted result. If the datasource-request has a sortedBy attribute, the datasource returns a sorted-result (naturally) and therefore a node could be twice in the list. This said, here is a gif where you can see the request-urls.

In the example you cannot see the full impact of this. In this screenshot you can a extended example. Some nodes are duplicated, and some seem to be not present, but the space is reserved with a white-space row (this screenshot is not edited, there are really 9 empty rows ;-) )



2. There is a displaying issue, if you click on the [+] symbol. If you do this on a folder like "0-6" the blue "hover" marking jumps to the first node of the tree. If there was a previous selection, this doesn't occur and even after moving the mouse, the blue hover is correct displayed.
Sample:


Both are reproducable in all browsers and with the lates nightly (SmartClient_v100p_2015-04-07_Pro).

isc.TreeGrid.create({
	"ID" : "theTreeGrid",
	"width" : "100%",
	"height" : "100%",
	"selectionType" : "multiple",
	"canEdit" : false,
	"showFilterEditor" : false,
	"initialSort":[
	 {
	  "property":"nameField",
	  "direction":"ascending"
	 }
	],
	dataSource : isc.DataSource.create({
		"fields" :
		[{
				"name" : 'parentId',
				"hidden" : true,
				"rootValue" : '0',
				"foreignKey" : 'treeGridGeneratedIndex'
			}, {
				"name" : 'treeGridGeneratedIndex',
				"hidden" : true,
				"primaryKey" : true,
				"canView" : false
			}, {
				"name" : "nameField",
				"title" : "Name",
				"type" : "text"
			}, {
				"name" : "lastField",
				"title" : "gfds",
				"type" : "text"
			}
		],
		"dataFormat" : "json",
		"dataURL" : "http://devset.de/treegrid.php",
		"transformRequest" : requestTransformer,
		"transformResponse" : responseTransformer,
		"recordXPath" : "\/resultData",
		"canReturnOpenFolders" : true,
		"useHttpProxy" : false
	}),
	dataProperties : {
		openProperty : "isOpen",
		childrenProperty : "children"
	},
	"autoFetchData" : true,
	"dataPageSize" : 50,
	"dataFetchMode" : "paged",
	"selectionProperty" : "isSelected",
	"fields" :
	[{
			"name" : "nameField",
			"title" : "Name",
			"type" : "text",
			"canEdit" : false,
			"canSort" : false
		}, {
			"name" : "lastField",
			"title" : "lastFieldName",
			"type" : "text",
			"canEdit" : false,
			"canSort" : false
		}
	]
});
function requestTransformer(dataSourceRequest) {
	var operationType = {
		operationType : dataSourceRequest.operationType
	};
	if (dataSourceRequest.operationType == "fetch") {
		var params = {
			sortBy: dataSourceRequest.sortBy,
			start : dataSourceRequest.startRow,
			end : dataSourceRequest.endRow
		};
	}
	return isc.addProperties({}, operationType, dataSourceRequest.data, params);
}
function responseTransformer(dataSourceResponse, dataSourceRequest, jsonData) {
	if (dataSourceRequest.operationType == "fetch") {
		dataSourceResponse.totalRows = jsonData.totalRows;
		dataSourceResponse.endRow = jsonData.endRow;
		dataSourceResponse.startRow = jsonData.startRow;
	};
}

Best Regards

[Isomorphic]

We see the issue and are investigating.

[Isomorphic]

Is the server used by your sample supposed to provide the results in sorted order when a sortBy field is present?

[SimonF]

By now the provided example doesn't return the result sorted by anything.
This was not important for the example, so i haven't done this yet.

For the example it was important to show that at the first datasource-request there is no sortBy parameter set. Also it was important, that the sortBy is set in the second datasource-request, but neither at the datasource-request for the root neither the first datasource-request of a child of the root.

Thanks for feedback and invesigating

[Isomorphic]

A fix has been committed to SC 10.0p and newer for the sortBy issue. It should be in the nightly builds marked 4-10-2015.

We don't see the exact behavior you're showing for the second issue, although the rollover styling does disappear when the node is expanded and isn't reapplied. This is currently under investigation.