how to render nested content media picker

Elin 45 posts 166 karma points

Sep 26, 2017 @ 15:00

Nested Content Feedback

Umbraco 7

Hi,

Can anyone out there please help; I've been trying to get the media picker image to show on the front end for 2 days now, but I keep getting an error message, I've tried everything and don't know exactly what I'm doing wrong.

See my code below.

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@{
    Layout = null;
    var Current = CurrentPage;
}

<div class="img-accordion">
    <ul>
        @{
            var accordion = Current.GetPropertyValue<IEnumerable<IPublishedContent>>("nestedContent");

            foreach (var item in accordion) {
                <li>
                    <div>
                        <a href="#">
                            <img src='@Umbraco.Media(@item.GetPropertyValue("accordionIcon")).Url'>
                            <span class="overlay">
                                <h3>@Umbraco.Field(item, "accordionTextField")</h3>
                                <p>@Umbraco.Field(item, "accordionTextareaField")</p>
                            </span>
                        </a>
                    </div>
                </li>
            }
        }
    </ul>
</div>

and below is the error I keep getting.

enter image description here

Note: I am working with Dynamic content, when I switch to strongly typed (@inherits Umbraco.Web.Mvc.UmbracoViewPage), everything seems to be working.

The question would be how to render the Media Picker using Dynamic (@inherits Umbraco.Web.Mvc.UmbracoTemplatePage) ?

Thanks

Copy Link

Alex Skrypnyk 6132 posts 23951 karma points MVP 7x admin c-trib

Oct 05, 2017 @ 15:31

Hi Elin

Do not use dynamics! Please, read "Common Pitfalls" - https://our.umbraco.org/documentation/reference/Common-Pitfalls/

What is the "Current" variable in your example?

var accordion = Current.GetPropertyValue<IEnumerable<IPublishedContent>>("nestedContent");

Thanks,

Alex

Copy Link

Elin 45 posts 166 karma points

Oct 06, 2017 @ 17:21

Hi Alex,

Thanks for sharing this link with me, I'll try to avoid using dynamics next time.

To answer your question, Current refers to the current page var Current = CurrentPage;

I updated my original post, somehow I missed adding it.

Thanks.

Elin

Copy Link

Alex Skrypnyk 6132 posts 23951 karma points MVP 7x admin c-trib

Oct 07, 2017 @ 11:36

This code should work:

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@{
    Layout = null;
}

<div class="img-accordion">
    <ul>
        @{
            var accordion = Model.Content.GetPropertyValue<IEnumerable<IPublishedContent>>("nestedContent");

            foreach (var item in accordion)
            {
                <li>
                    <div>
                        <a href="#">
                            @if (item.HasValue("accordionIcon"))
                            {
                                var image = item.GetPropertyValue<IPublishedContent>("accordionIcon");
                                <img src='@image.Url'>
                            }
                            <span class="overlay">
                                <h3>@Umbraco.Field(item, "accordionTextField")</h3>
                                <p>@Umbraco.Field(item, "accordionTextareaField")</p>
                            </span>
                        </a>
                    </div>
                </li>
            }
        }
    </ul>
</div>

Thanks, Alex

Copy Link

Elin 45 posts 166 karma points

Oct 07, 2017 @ 12:18

Hi Alex,

I tried your code, but I get an error message, see the screenshot below.

enter image description here

Thanks,

Elin

Copy Link

Alex Skrypnyk 6132 posts 23951 karma points MVP 7x admin c-trib

Oct 07, 2017 @ 21:41

Hi Elin,

Try this one:

var imageId = item.GetPropertyValue<int>("accordionIcon");
var image = Umbraco.TypedMedia(imageId);
if(image != null)
{
    <img src='@image.Url'>
}

Copy Link

Elin 45 posts 166 karma points

Oct 09, 2017 @ 14:33

Hi Alex,

I got another error with the new code you provided.

enter image description here

And this is the same error that I've been having trouble with, it keeps telling me that

ImageAccordion does not contain a definition for "GetPropertyValue"

I really don't know what to do anymore, I guess this just won' work for some reason.

Thanks,

Elin

Copy Link

Thomas 315 posts 602 karma points c-trib

Oct 06, 2017 @ 20:37

can you:

var image = Model.Content.GetPropertyValue<IPublishedContent>("accordionIcon");
if (image != null)
{   
    <img src="@image.Url" alt="@image.Name" />
}

??

Copy Link

is working on a reply...

Flag this post as spam?

How to Render Nested Content Media Picker