[Silk UI Web] Dynamic Carousel

Back to Forums

Adrian

Solved

Question

Forge

The help section on the SilkUI Carousel component states: "The placeholder can also have a list item providing dynamic content." I am beginning to discover SilkUI and this is not at all clear to me. What I am trying to do is have a carousel show a dynamic number of items initialized from a record list (I have one web block showing the attributes of an Address entity and I would like to have the carousel filled with as many items as I have Adresses in a Record List). Is that even possible?

Please can someone explain dynamic content in SilkUI carousel?
Thanks in advance, this is urgent!

15 Jan 2016

Samuel Jesus

Staff

Solution

Hello,

Although the answers that were posted here are correct, let me explain the solution with some more details:

The Carousel allows you to show your data "one item at a time". To do that you just have to drag and drop the carousel into your page and then to put your items inside the "Items" placeholder.

If you want to have dynamic data on a carousel, you first need an agregatte (or query) and you need to iterate that information. For that, I'm using a List Record:

Now, if instead of images you want to build your own custom elements to be iterated, you just have to enclose everything in a container. The carousel iterates the first level elements inside the placeholder, so by using a container around your text and images, that container will be the first level element and will iterate correctly:

Also, you can change the value "NewLine" from the list record, to prevent the list record from adding line breaks that can be interpreted as something to be iterated as well:

Please let us know if this solution solves your problem, and if you need any more help.

Cheers,
Samuel Jesus

See solution in context

03 Feb 2016

Dinis Carvalho

Staff

Hi!

You can have a list record inside of the Carousel and it will display as many items as records you get from the database.

I haven't tested this, but using a Web Block with that record list may have some problems because the Carousel uses its "first level" children as different pages but the entire Web Block would be that child, creating a single page with all items.

15 Jan 2016

Adrian

I still don't understand this, what do I need to put in the Carousel? I would imagine that the Carousel needs to accept an input parameter of type Record List (as returned by an Aggregate for example) and it would multiply the container put as first child as many times as objects it the list, passing each time one object from the list to the container (or component in the container). But th Carousel object does not accept a Record List as parameter; whhere to put the list of items needed to be shown?
So how the question stands: how to show dynamic content in a carousel?

15 Jan 2016

Carlos Conde

Look at this post - https://www.outsystems.com/forums/discussion/14883/Carousel+-+Dublin+-+How+to+use/

You have a sample oml.

15 Jan 2016

Adrian Birlogeanu

The example you mention uses a static carousel with images, that's a no brainer. The question was how to load a dynamic number of items in the carousel (see above). Anyone ideas?

19 Jan 2016

Samuel Jesus

Staff

Solution

Also, you can change the value "NewLine" from the list record, to prevent the list record from adding line breaks that can be interpreted as something to be iterated as well:

Please let us know if this solution solves your problem, and if you need any more help.

Cheers,
Samuel Jesus

03 Feb 2016

Domingo Del Rosario

Hi, there is a way when I change the Item in the carousel I be able to call an action and perform a query and ajax refresh?

Im trying to implement something like the Energy pre-built. I change the date and some things on the page change and refresh. But the on notify implementation is deprecated.

17 Aug 2016

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.

See the full guidelines