12.0p SelectItem pickListHeigth issue and question

[Blama]

Hi Isomorphic,

how can I define that a pickList for a SelectItem has the maximum possible height without introducing scrolling somewhere or moving content of view?
I have these two approaches below, both with errors where the application content is moved out of view.

Please see this modified testcase (v12.0p_2020-03-24) (I'm using maximized Chrome with Address Bar and Bookmark Bar on a FullHD screen).

isc.ListGrid.create({
    ID:"dsListGrid",
    width: "100%",
    height: "100%",
    autoFetchData: true,
    dataSource: "supplyItem",
    showFilterEditor: true,
    fields:[
        {name:"itemID", width:60},
        {name:"itemName", filterEditorType:"SelectItem",
         filterEditorProperties: {
             multiple:true, [B]pickListHeight:900 // try also 2000[/B]
            }
         },
        {name:"SKU"},
        {name:"category"},
        {name:"units"}
    ]
});

With pickListHeight:900 I get a broken Showcase that doesn't recover (see picture).
With pickListHeight:2000 I get a broken Showcase every 2nd time the pickList is opened (does recover when pickList is closed) Design then as above.

It is possible that I reported a similar bug before and that you fixed it, so this might be a regression.
As I don't know client resolutions, any picked value can result in this. IMHO a setting maxPickListHeight (perhaps also minPickListHeight) would really help here.
Or treating the current pickListHeight as maximum value and never moving window content out of view.

Best regards
Blama

[Blama]

Attached picture.

[Blama]

Hi Isomorphic

this is most likely the thread about moving showcase out of view, that I meant. It's about Window and not pickList, tough.

Best regards
Blama

[Isomorphic]

You seem to be saying you want auto-sizing, but you haven't configured auto-sizing, you've just set a large fixed value.

A large fixed value will expect off the screen, as that's what you've configured it to do.

[Blama]

Hi Isomorphic,

yes, autoSizing. Is it autoFitData: "vertical" you are referring to?

Best regards
Blama

[Isomorphic]

Depends what you want, but yes, that would fit to records up to a maximum, with pickListHeight also acting as a maximum.

[Blama]

Hi Isomorphic,

I extended the example (important parts in bold) and tried different property combinations, but to me it seems this is not working.

To clarify the use case: I'm trying to get a pickList, as low as possible if only a few records, as high as possible if many records.
Right now I only care about pickList height, not pickList width.

isc.ListGrid.create({
    ID: "dsListGrid",
    width: "100%",
    height: "100%",
    autoFetchData: true,
    dataSource: "supplyItem",
    showFilterEditor: true,
    fields: [
        {name: "itemID", width: 60},
        {
            name: "itemName",
            filterEditorType: "SelectItem",
            filterEditorProperties: {
                multiple: true,
[B]                // pickListHeight: 900, // Try also 2000
                // pickListWidth: 800,
                pickListProperties: {
                    autoFitData: "both", // No effect?
                    cellHeight: 40 // Working
                },[/B]
                pickListFields: [
                 {name: "itemName", width:125},
                 {name: "units"},
                 {name: "unitCost"}
                ],
                pickListCriteria: {
                    _constructor: "AdvancedCriteria",
                    operator: "and",
                    criteria: [{
                        fieldName: "itemID",
                        operator: "lessThan",
[B]                        value: 100[/B]
                    }]
                }
            }
        },
        {name: "SKU"},
        {name: "category"},
        {name: "units"}
    ]
});

Best regards
Blama

[Blama]

Hi Isomorphic,

any update on this one?

Thank you & Best regards
Blama

[Isomorphic]

This issue is resolved in our active development branch and will be ported back to 12.0 shortly.

Essentially the main bug you hit here was that the pickList should never have rendered tall enough to require scrolling. Once this happened, a native scroll could occur when the pickList received focus, getting you into the bad state in the screenshot.
This is the bug we've addressed

For clarity - the correct behavior is this:
- the height of a pickList will automatically be determined by the number of records it contains, and how tall they are (autoFit:"vertical" type behavior)
- however - it should never render so tall that it will extend beyond the current browser viewport.
- additionally, the pickListHeight attribute may be set to further limit the height

So if you have a pickList with "pickListHeight" set to 900, but there are only 450px of space available under the SelectItem, it will only render up to 450px tall [depending on the # of rows in the list]

There is also some logic to ensure that the pickList renders either above or below the SelectItem text box depending on how much space is available, so if you have a SelectItem near the bottom of the page with a lot of space above it, the pickList will appear above it, rather than below it.

On the horizontal axis the behavior is similar - once again the pickList should not extend beyond the browser viewport, and may be additionally limited by an attribute. In this case it's "pickListMaxWidth" (as "pickListWidth" acts as a minimum).

Regards
Isomorphic Software

[Blama]

Hi Isomorphic,

that sounds reasonable, thanks! Looking forward to the change.

Best regards
Blama

[Isomorphic]

This change has been applied to all 12.x branches.
Please try the latest nightly build and let us know if you encounter any problems

Regards
Isomorphic Software

[Blama]

Hi Isomorphic,

I retested with v12.0p_2020-04-15 and v12.1p_2020-04-15 and the issue is gone now, thank you.
I noticed one irregularity where I think it's not on purpose given your explanation in #9. See the testcase below:

• Without top: 300 (I'm on a FullHD display with Chromium 81 and URL bar + Bookmark bar) the pickList is displayed only below the filterRow.
• With top: 300 it's full viewport height and therefore over the filterRow.

I'm not sure which behavior is correct, but I assume the first one and then having the picklist either above or below the filterRow, depending on where there is more viewport space left.

Best regards
Blama

isc.ListGrid.create({
    ID: "dsListGrid",
    width: "100%",
    height: "100%",
    top: 300, // Try with and without this and with different values
    autoFetchData: true,
    dataSource: "supplyItem",
    showFilterEditor: true,
    fields: [
        {name: "itemID", width: 60},
        {
            name: "itemName",
            filterEditorType: "SelectItem",
            filterEditorProperties: {
                pickListHeight: 1000,
                pickListCriteria: {
                    _constructor: "AdvancedCriteria",
                    operator: "and",
                    criteria: [{
                        fieldName: "itemID",
                        operator: "lessThan",
                        value: 100
                    }]
                }
            }
        },
        {name: "SKU"},
        {name: "category"},
        {name: "units"}
    ]
});

[Blama]

Hi Isomorphic,

after updating v12.0p_2020-03-11 -> v12.1p_2022-08-10 I'm checking old tickets if they need any rework or I can use any of the new features.

It seems that the initial problem of this ticket is solved, but the framework is still behaving differently in some cases, like in #12.
Can you check if this is on purpose? (This is a very minor issue most likely).

Thank you & Best regards
Blama