displaying images from multiple media picker in a carousel element

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

ThomasBrunbjerg 90 posts 182 karma points

Aug 21, 2017 @ 11:59
0

Displaying images from multiple media picker in a carousel element

Using Umbraco And Getting Started

Umbraco 7
I know this has been asked before, but no solution I've tried has worked for me. I need to insert X number of images from a multiple media picker into a a carousel element.

Currently I merely extract each image using a hardcoded index.
```
<div class="active item" data-slide-number="0"> <img src='@(Model.Content.GetPropertyValue<IEnumerable<IPublishedContent>>("sommerhusBilleder").ToList()[0].Url)'></div>
```
But this doesn't work when the client should be able to insert any number of images. I need to iterate over each image with this markup, while also changing the data-slide-number each time, so that it matches to the thumbnails I have associated with it.

How can I iterate over X amount of images and extract their URL's to use in my carousel?
Copy Link

Neil Hodges 338 posts 987 karma points

Aug 25, 2017 @ 14:59

Ive not tested this but could you do something like thi?s:

@{
    var sliderItems = Model.Content.GetPropertyValue<IEnumerable<IPublishedContent>>("sommerhusBilleder");
    var indx = 0;
    foreach (var imageItem in sliderItems.Take(5))
    {
        <div class="active item" data-slide-number="@indx">
            <img src='@imageItem.Url)'>
        </div>
        indx++;
    }
}

Copy Link

is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?