Hello,

I'm trying to render a image inside my foreach loop but having some trouble.

My node structure is like this;

• Section Node

  • Divider Node

    • Child Item Node

Here is my code below;

@inherits Umbraco.Web.Macros.PartialViewMacroPage

<ul class="no-bullet mediaLister">
    @foreach (var child in Model.Content.Children.Where(c => c.DocumentTypeAlias.Equals("Blank")))
    {
        <li>
            <a href="@child.Url">@child.Name</a>
            @if (child.Children.Any(x => x.DocumentTypeAlias.Equals("MediaItem")))
            {
                <ul class="no-bullet mediaItems">
                    @foreach (var page in child.Children.Where(p => p.DocumentTypeAlias.Equals("MediaItem")))
                    {
                        <li>
                            <a href="@page.Url">@page.Name</a>

                            <img class="img-thumbnail full" src="@Umbraco.TypedMedia(page.GetPropertyValue("mediaImage")).GetPropertyValue("umbracoFile")" alt="" />

                        </li>
                    }
                </ul>
            }
        </li>
    }
</ul>

Can't quite remember how to render an image as part of two foreach loops - i've done it before so not sure where i am going wrong. :(

UPDATE:

I knew this would happen, as soon as i posted for help, BANG - It came in to my head on how to do it. I have to check there is a value if so render the image using Umbraco.TypedMedia & get property value.

Updated code below;

@inherits Umbraco.Web.Macros.PartialViewMacroPage

<ul class="no-bullet mediaLister">
    @foreach (var child in Model.Content.Children.Where(c => c.DocumentTypeAlias.Equals("Blank")))
    {
        <li>
            <a href="@child.Url">@child.Name</a>
            @if (child.Children.Any(x => x.DocumentTypeAlias.Equals("MediaItem")))
            {
                <ul class="no-bullet mediaItems">
                    @foreach (var page in child.Children.Where(p => p.DocumentTypeAlias.Equals("MediaItem")))
                    {
                        <li>
                            <a href="@page.Url">@page.Name</a>

                            @{
                                if (page.HasValue("mediaImage"))
                                {
                                    var mediaItem = Umbraco.TypedMedia(page.GetPropertyValue("mediaImage"));
                                    <img src="@mediaItem.GetPropertyValue("umbracoFile")" alt="@mediaItem.GetPropertyValue("Name")" />
                                }
                            }

                        </li>
                    }
                </ul>
            }
        </li>
    }
</ul>

Thanks Javed