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 28, 2017 @ 11:23
    ThomasBrunbjerg
    0

    Looping through and displaying a list of images with the Image Cropper document type

    I currently in the midst of changing my multiple media picker document type to 10 image cropper document types instead.

    I'm unsure how to go about looping through these newly created properties and displaying them in my carousel element.

    Before I used this code to loop through me media files:

    @{var images = Model.Content.GetPropertyValue<IEnumerable<IPublishedContent>>("sommerhusSlideshowBilleder").ToList()};
    @for (var i = 0; i < images.Count; i++)
                                            {
                                            <div class="@(i < 1 ? " active":"") item" data-slide-number="@i">
                                                <img src='@images[i].Url'>
                                            </div>
                                            }
    

    Now I instead need to loop through X number of "image cropper" images, which each has their own alias. What is the best way to approach this?

  • Alex Skrypnyk 6131 posts 23950 karma points MVP 7x admin c-trib
    Aug 28, 2017 @ 12:28
    Alex Skrypnyk
    1

    Hi Thomas

    What format of each property alias will be?

    For example, you can do it like that:

    @for (var i = 0; i < 10; i++)
    {
        var image = Model.Content.GetPropertyValue<IPublishedContent>("sommerhusSlideshowBilleder" + i);
        <div class="@(i < 1 ? " active":"") item" data-slide-number="@i">
            <img src='@image.Url'>
        </div>
    }
    

    All your properties should be sommerhusSlideshowBilleder0, sommerhusSlideshowBilleder1, sommerhusSlideshowBilleder2 and etc.

    Thanks,

    Alex

  • ThomasBrunbjerg 90 posts 182 karma points
    Aug 28, 2017 @ 12:38
    ThomasBrunbjerg
    0

    Hi Alex

    I'm getting a NullReferenceException.

    http://i.imgur.com/TkJsb0L.png

    I changed the loop to start at 1 due to my alias naming.

    I'm not sure what object reference the error is referring to here.

  • Alex Skrypnyk 6131 posts 23950 karma points MVP 7x admin c-trib
    Aug 28, 2017 @ 12:40
    Alex Skrypnyk
    101

    Hi Thomas

    Looks like I made mistake when I wrote render code, but I fixed it, look on this one:

    @for (var i = 1; i < 11; i++)
    {
        <div class="@(i < 1 ? " active":"") item" data-slide-number="@i">
            <img src="@Url.GetCropUrl(Model.Content, "billede" + i)" />
        </div>
    }
    
  • ThomasBrunbjerg 90 posts 182 karma points
    Aug 28, 2017 @ 12:53
    ThomasBrunbjerg
    0

    Ah, no problem. It works now, although I would like to not include empty image URLs when there is no image to be retrieved with the GetCropUrl() function.

    I tried doing something like this:

    if(@Url.GetCropUrl(Model.Content, "billede" + i, "Main") != null)
                                                {
                                                    <div class="@(i < 2 ? " active":"") item" data-slide-number="@i">
                                                        <img src="@Url.GetCropUrl(Model.Content, "billede" + i, "Main")" />
                                                    </div>
                                                }
    

    But that still returns empty images. Is there a way to check whether an image has been uploaded to an image cropper property type?

  • Alex Skrypnyk 6131 posts 23950 karma points MVP 7x admin c-trib
    Aug 28, 2017 @ 13:07
    Alex Skrypnyk
    1

    Try this code:

    @if(Model.Content.HasValue("billede" + i))
    {
        <div class="@(i < 2 ? " active":"") item" data-slide-number="@i">
            <img src="@Url.GetCropUrl(Model.Content, "billede" + i, "Main")" />
        </div>
    }
    
  • ThomasBrunbjerg 90 posts 182 karma points
    Aug 28, 2017 @ 13:16
    ThomasBrunbjerg
    0

    Thanks, that worked for me! :)

  • Alex Skrypnyk 6131 posts 23950 karma points MVP 7x admin c-trib
    Aug 28, 2017 @ 13:16
    Alex Skrypnyk
    0

    Glad to help you!

    Have a great evening!

Please Sign in or register to post replies

Write your reply to:

Draft