Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Grouping mode dropdown displays even though field does not have any grouping modes

    SmartClient_v101p_2016-02-16_PowerEdition

    Here is another small UI issue that our users have encountered. We allow users to group on a string field using one of two options, normal or parsed. Parsed basically groups the grid on N fields that have been dynamically created when data is fetched. I omitted the custom grouping code for brevity, but the creation of the dynamic fields is contained within this test case. I also found the area of the code that seems to be causing this issue, and talk about that below.

    REPRO steps
    ===========
    1. Load the test case
    2. Right click the path column, and select Configure Grouping
    3. Observe that path is already displayed
    4. Add a new group, Project
    5. Add a new group, Path Level 1
    6. Observe that the dropdown is displayed for grouping modes

    I have tried setting grouping modes on the field to null or an empty array with no success.

    I played around with the code and seemed to narrow it down to the code in the attached screenshot. Basically, looks like its checking for null but in my case the code is returning false. I didn't really do much more analysis other than returning null to resolve the issue. Click image for larger version

Name:	11-16-2015 2-58-04 PM.png
Views:	91
Size:	84.5 KB
ID:	234955

    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 = "SNT-14287";
                
                // test data
                var data = [
                { project: "123 Avenue", path:"East->GA->Atlanta->Engineering", redflag: "", owner: "University of MD", ins: 33, obs: 231, unsafe: 9, safe: 222, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" },
                { project: "Long Project Name", path:"East->PA->Pittsburgh->Engineering",redflag: "", owner: "Staples", ins: 33, obs: 231, unsafe: 9, safe: 80, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" },
                { project: "6789 Avenue B", path:"East->PA->Pittsburgh->Finance",redflag: "", owner: "University of MD", ins: 33, obs: 23, unsafe: 9, safe: 222, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" },
                { project: "123 Avenue", path:"East->PA->Pittsburgh->Maintenance",redflag: "", owner: "University of MD", ins: 33, obs: 231, unsafe: 9, safe: 222, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" },
                { project: "Feliz Navidad", path:"East->VA->Newport News",redflag: "", owner: "University of MD", ins: 33, obs: 1, unsafe: 9, safe: 222, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" },
                { project: "123 Avenue", path:"East->VA->Newport News->Engineering",redflag: "", owner: "University of MD", ins: 33, obs: 231, unsafe: 9, safe: 10, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" },
                { project: "Whitehouse Lawn Maintenance", path:"East->PA->Philadelphia->Electrical",redflag: "", owner: "University of MD", ins: 33, obs: 231, unsafe: 9, safe: 220, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" },
                { project: "123 Avenue", path:"East->PA->Philadelphia->Electrical", redflag: "", owner: "Staples", ins: 33, obs: 1, unsafe: 9, safe: 222, insDate: "10/12/2011", score:"<img src='star-4.png'/>55%", link:"<a href=''>View Analysis</a>" }
            ];
            
                isc.DataSource.create({
                ID: "ds",
                fields: [
                    {name:"project", title:"Project", type:"text" },
                    {name:"path", title:"Path", type:"text", groupingModes: ["String", "Parse"] },
                    {name:"owner", type:"text", title:"Owner"},
                    {name:"ins", type:"integer", title:"#Inspections"},
                    {name:"obs", type:"integer", title:"#Observations"}
                    
                ],
                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,
                    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",
                    canMultiGroup: true
                });    
                
                
    
                
                // the main page layout - place all other components afetr diagLabel
                var layout = isc.VLayout.create({
                    width:"100%",
                    membersMargin: 20,
                    members: [
                        // ===== DO NOT REMOVE diagLabel
                        diagLabel,
                        // ===== place anty components here
                        grid
                    ]
                });
                
                // add additional fields to grid based on level
                
                var createPathValueFnx = function(field) {
    
                    var name = field.name;
    
                    return function(value, record, rowNum, colNum, grid) {
                        var str = "";
    
                        // get the level of this field
    
                        var level = field.name.split("-")[1];
                        var path = record["path"];
                        if (path != null && typeof (path) != "undefined") {
                            var values = path.split("->");
                            if (values.length > level)
                                str = values[level].trim();
    
                            record[name] = str;
                        }
    
                        return str;
                    }
                }
            
                var fields = grid.getAllFields();
                
                var field = {
                    name : "path_level-1",
                    title : "Path Level 1",
                    type : "text"
                };
                field.formatCellValue = createPathValueFnx(field);
                field.getGroupValue = createPathValueFnx(field);
                fields.push(field);
                
                var field = {
                    name : "path_level-2",
                    title : "Path Level 2",
                    type : "text"
                };
                field.formatCellValue = createPathValueFnx(field);
                field.getGroupValue = createPathValueFnx(field);
                fields.push(field);
                grid.setFields(fields);
    
            </script>
    
        </body>
    
    </html>

    #2
    We've made a change to address this issue. Please try the next nightly build, dated February 18.

    Regards
    Isomorphic Software

    Comment


      #3
      Verified in my dev environment. Thanks.

      Comment

      Working...
      X