SmartClient_v101p_2016-03-02_PowerEdition
We have a use case where the grid generates N number of dynamic fields based on the data contained in another field. We have just about all of the issues resolved with this design, however this particular one may or may not be an issue.
A specific field can be grouped two ways, the first groups the field as it would normally, the second changes the grooup fields to the derived fields mentioned above. For the sake of brevity I simplified this scenario below.
REPRO steps:
==========
1. Load the test case
2. Group Project field by "ONE"
3. Observe that ONE is checked and the grid is grouped
4. Group the grid by Project "TWO"
5. Observe that the grid groups by Path (this simulates our derived fields)
6. Observe, however, that Project "ONE" is still checked
7. Ungroup the grid
8. Observe Project "ONE" is still checked
9. Refresh page
10. Group by Project "TWO"
11. Observe that the grid groups
12. Note that no grouping modes are checked under Project
Again, this may or may not be an issue, but I would like to get the selected grouping mode to check the correct value. Seems like when I change the group fields and return false in handleGroupBy, the UI is not updated. However, if I return true, then my custom group override does not work.
Do you have any suggestions on how to make this work?
We have a use case where the grid generates N number of dynamic fields based on the data contained in another field. We have just about all of the issues resolved with this design, however this particular one may or may not be an issue.
A specific field can be grouped two ways, the first groups the field as it would normally, the second changes the grooup fields to the derived fields mentioned above. For the sake of brevity I simplified this scenario below.
REPRO steps:
==========
1. Load the test case
2. Group Project field by "ONE"
3. Observe that ONE is checked and the grid is grouped
4. Group the grid by Project "TWO"
5. Observe that the grid groups by Path (this simulates our derived fields)
6. Observe, however, that Project "ONE" is still checked
7. Ungroup the grid
8. Observe Project "ONE" is still checked
9. Refresh page
10. Group by Project "TWO"
11. Observe that the grid groups
12. Note that no grouping modes are checked under Project
Again, this may or may not be an issue, but I would like to get the selected grouping mode to check the correct value. Seems like when I change the group fields and return false in handleGroupBy, the UI is not updated. However, if I return true, then my custom group override does not work.
Do you have any suggestions on how to make this work?
Code:
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
.diagInfo {
font-size: 14px;
font-weight: bold;
padding: 5px;
}
</style>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_Core.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_Foundation.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_Containers.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_Grids.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_Forms.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_DataBinding.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_Drawing.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_PluginBridges.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/system/modules/ISC_Charts.js"></script>
<script type="text/javascript" SRC="http://localhost:8080/isomorphic/skins/EnterpriseBlue/load_skin.js"></script>
<script type="text/javascript" >
var isomorphicDir="http://localhost:8080/isomorphic/";
// set this to the correct JIRA ticket
var JIRA_TICKET = "SNQA-1178";
// test data
var data = [
{ project: "123 Avenue", path:"Central", owner: "University of MD", ins: 33, obs: 231, unsafe: 9 },
{ project: "Long Project Name", path:"North", owner: "University of MD", ins: 33, obs: 231, unsafe: 9 },
{ project: "6789 Avenue B", path:"East", owner: "University of MD", ins: 33, obs: 23, unsafe: 9 }
];
var formatFnx = function(value, record, rowNum, colNum, grid) {
var str = record["path"] + " region"
record["test"] = str;
return str;
}
isc.DataSource.create({
ID: "ds",
cacheData:data,
clientOnly: true
});
// once page loads set some diagnostic information, DO NOT CHANGE
isc.Page.setEvent("load", function() {
document.title = JIRA_TICKET + " (SmartClient version " + isc.versionNumber + ")";
var html = [];
html.push("Jira: " + JIRA_TICKET);
html.push("SmartClient: " + isc.versionNumber);
html.push("Browser: " + navigator.appCodeName + " " + navigator.appName + " " + navigator.appVersion);
diagLabel.setContents( html.join("<br>"));
});
</script>
</head>
<body>
<script>
// ===== DO NOT REMOVE =====
var diagLabel = isc.Label.create({
ID: "diagInfo",
width: "100%",
styleName: "diagInfo",
autoFit: true
});
// ===== DO NOT REMOVE =====
// basic grid
var grid = isc.ListGrid.create({
dataSource: ds,
fields: [
{name:"project", title:"Project", type:"text", groupingModes: ["One", "Two"] }
,{name:"path", title:"Path", type:"text"}
],
dataFetchMode : "local",
autoFetchData: true,
clientOnly: true,
position: "relative",
width : "100%",
align : "center",
autoFitData : "vertical",
autoFitMaxHeight : 400,
alternateRecordStyles : true,
canAddFormulaFields : true,
canAddSummaryFields : true,
canGroupBy : true,
canReorderFields : true,
showGroupSummary : true,
useAdvancedFieldPicker: true,
advancedFieldPickerThreshold: 5,
autoDraw: false,
badFormulaResultValue: "NA",
handleGroupBy: function(fields, specifiers) {
fieldName = fields[0];
console.log(fieldName);
var f = grid.getField(fieldName);
if (f != null) {
groupingType = f.groupingMode;
console.log(groupingType);
}
if(groupingType == "Two") {
grid.groupBy("path");
return true;
}
}
});
var layout = isc.VLayout.create({
ID : "PSC_masterLayout_",
// TODO: Look into why we had to hard set.
width : 1047,
// layoutMargin : 10,
defaultLayoutAlign : "center",
layoutAlign : "center",
align : "center",
position : "relative",
members: [
// ===== DO NOT REMOVE diagLabel
diagLabel,
// ===== place anty components here
grid
]
});
</script>
</body>
</html>
Comment