Canvas width="*" or height="*" error

[Hirn]

thanks. everything works with VLayout

[Isomorphic]

Yes, and this is what the docs tell you should happen - it is as designed, and exactly what is desirable.

It looks like you are probably confused about the difference between VLayout and VStack. Please review the documentation for those two classes - if you are trying to fill available space, the VLayout is what you are looking for.

[Hirn]

With the example code I provided, https://smartclient.com/smartclient-...AutoFitNewRows

isc.ListGrid.create({
    autoDraw: false,
    ID: "countryList",
width:"100%",
height:"*",
---------------------
    alternateRecordStyles:true,
    data: countryData,
    canEdit: true,
    editEvent: "click",
    listEndEditAction: "next",
    enterKeyEditAction: "nextRowStart",
    fields: [
        {name: "countryCode", title: "Country Code"},
        {name: "countryName", title: "Country Name"},
        {name: "population", title: "Population"}
    ]
})

isc.IButton.create({
    ID: "button",
    autoDraw: false,
    title:"Edit New",
    click:"countryList.startEditingNew()"
});

isc.VStack.create({
width:"100%",
height:"100%",
    membersMargin: 10,
    members: [
        countryList, button
    ]
});

the List Grid looks like this


And if I change the code to this one, then the List Grid looks like this

isc.ListGrid.create({
    autoDraw: false,
    ID: "countryList",
width:"100%",
height:"400",
------------------------

[Isomorphic]

You keep asserting there's an error, but what error do you have in mind?

There isn't a JavaScript error, and there's no warning logged by SmartClient, and the component layout is exactly as the docs tell you to expect with your settings. So what is the error you are perceiving?

[Hirn]

Maybe I really chose an unsuccessful example, but in the following example, this error also manifests itself


https://smartclient.com/smartclient-...AutoFitNewRows

isc.ListGrid.create({
    autoDraw: false,
    ID: "countryList",
width:"100%",
height:"*",
    alternateRecordStyles:true,
    data: countryData,
    canEdit: true,
    editEvent: "click",
    listEndEditAction: "next",
    enterKeyEditAction: "nextRowStart",
    fields: [
        {name: "countryCode", title: "Country Code"},
        {name: "countryName", title: "Country Name"},
        {name: "population", title: "Population"}
    ]
})

isc.IButton.create({
    ID: "button",
    autoDraw: false,
    title:"Edit New",
    click:"countryList.startEditingNew()"
});

isc.VStack.create({
width:"100%",
height:"100%",
    membersMargin: 10,
    members: [
        countryList, button
    ]
});

[Isomorphic]

Star ("*") sizes can be used in the context of a Layout, but not outside of that (although we do have a fallback of basically treating it like 100%).

This example does not include a Layout so the error reported is correct.

If you have a question on how to achieve a particular layout goal, let us know.

[Hirn]

when using width="*" or height="*", an error is tracked in the canvas of the component
This can be seen in the example https://smartclient.com/smartclient-.../?id=editByRow
If you replace

isc.ListGrid.create({
    ID: "countryList",
    width:550, height:224, alternateRecordStyles:true,

on the code

isc.ListGrid.create({
    ID: "countryList",
    width:"*", height:"*", alternateRecordStyles:true,

Version SNAPSHOT_v13.1d_2024-04-02/Pro Deployment (2024-04-02)