SectionStack Item visibility

[Chris_A_Wood]

Sorry that I posted this in wrong forum, please ignore: The code below shows a sectionStack Section with 2 VLayouts one of which has its visibility set to "hidden" but it still shows. This can also be reproduced with in the smartclient samples page. Could this be considered a bug?

	isc.SectionStack.create({
        visibilityMode: "multiple",
		height: "100%",
		width: "50%",
        sections: [
            {title: "Section 1", expanded: true, items: [
                isc.Label.create({contents:"Introduction", height: 20}),
                isc.Label.create({contents:"Variable Data Rules", height: 20}),
				isc.Label.create({contents:"Technical Specifications", height: 20})
            ]},
            {title: "Section 2", ID: "IDPackagingItemsHeader", expanded: true, items: [
				isc.VLayout.create({
					backgroundColor: "green",
					members:[
						isc.Label.create({contents:"Barcode Stickers", height: 20}),
						isc.Label.create({contents:"Printed Fabric Labels", height: 20}),
						isc.Label.create({contents:"Tickets", height: 20})
				]
				}),
				isc.VLayout.create({
					visibility: "hidden",
					backgroundColor: "yellow",
					members:[
						isc.Label.create({contents:"Kids", height: 20}),
						isc.Label.create({contents:"Ladieswear", height: 20}),
						isc.Label.create({contents:"Menswear", height: 20})
				]
				})
            ]}
        ]
    })

SmartClient Version: v8.3p_2012-11-21/LGPL Deployment (built 2012-11-21)

Safari 5.0.6
Firefox 16.02
Opera 12.10

[Isomorphic]

Sections in a section stack expand and collapse by changing the visibility of their items from hidden to visible and vice-versa.

The effect you're seeing is a result of attempting to set the visibility directly but having the sectionStack logic reverse this.

The best way to work around this effect is to have an outer VLayout containing the visible and hidden items:

isc.SectionStack.create({
        visibilityMode: "multiple",
		height: "100%",
		width: "50%",
        sections: [
            {title: "Section 1", expanded: true, items: [
                isc.Label.create({contents:"Introduction", height: 20}),
                isc.Label.create({contents:"Variable Data Rules", height: 20}),
				isc.Label.create({contents:"Technical Specifications", height: 20})
            ]},
            {title: "Section 2", ID: "IDPackagingItemsHeader", expanded: true, items: [
                  isc.VLayout.create({ members:[
				isc.VLayout.create({
					backgroundColor: "green",
					members:[
						isc.Label.create({contents:"Barcode Stickers", height: 20}),
						isc.Label.create({contents:"Printed Fabric Labels", height: 20}),
						isc.Label.create({contents:"Tickets", height: 20})
				]
				}),
				isc.VLayout.create({
					visibility: "hidden",
					backgroundColor: "yellow",
					members:[
						isc.Label.create({contents:"Kids", height: 20}),
						isc.Label.create({contents:"Ladieswear", height: 20}),
						isc.Label.create({contents:"Menswear", height: 20})
				]
				})
                  ]})
            ]}
        ]
    })

[Chris_A_Wood]

Many thanks isomorphic that worked a treat