Sign in Register
Go to solution
Copied to clipboard

Flag this post as spam?

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


  • Filip Nemecek 7 posts 48 karma points
    Jul 01, 2014 @ 21:59
    Filip Nemecek
    0

    Rendering Macro inside Partial View?

    Using Umbraco 7

    Hello,

    I have created macro to display pcitures (inspired by Razor recipe from Umbraco TV) it works fine but I need to use it inside my partial view that lists all the children page.

    I have classic foreach loop to list all children page, but when I insert macro here it does not work. Presumably because it tries to display photos of current page and not currently looped child.

    Unfortunately simple @page.RenderMacro(macroName) does not work :) Thanks!

     

     

     

    Copy Link
  • Dennis Aaen 4499 posts 18254 karma points admin hq c-trib
    Jul 01, 2014 @ 22:29
    Dennis Aaen
    1

    Hi Filip and welcome to our,

    Okay so if I understand your question correctly you want to list all images from child pages of CurrentPage in a macro and then add the macro to a Partial View.

    Maybe you could share the code that you have so far, then it´s easier to help.

    But one thing is the way that you are try to render the macro. Try use this in your partial view:

    @Umbraco.RenderMacro("macroName")

    Hope this helps,

    /Dennis

    Copy Link
  • Filip Nemecek 7 posts 48 karma points
    Jul 01, 2014 @ 22:44
    Filip Nemecek
    0

    Thanks, that works but in different scenarions.

    My code:

    <ul>    
    @foreach (var page in CurrentPage.Children.Where("Visible").OrderBy("CreateDate desc"))
    { 
    <h2>@page.appName</h2>
    <p>@page.appDescription</p>

    @Umbraco.RenderMacro("DisplayPhotos")           
    }
</ul>

    I am listing added apps, name and description work. Then I need to display also picture for each app. Macro renders pictures if current page has some under my defined property. But probably in my case it tries to show pictures associated with page that should list all the apps.

    Copy Link
  • Dennis Aaen 4499 posts 18254 karma points admin hq c-trib
    Jul 01, 2014 @ 23:24
    Dennis Aaen
    100

    Hi Filip,

    Good to hear that works. If it was me who should do the same as you. I will do it a little bit different. I will take all the code at should display all the children and their data an put in one razor maco and then just add the macro to the partial view where the data should be show.

    I will try to show you how I would make the macro look like:

    <ul>    
        @foreach (var page in CurrentPage.Children.Where("Visible").OrderBy("CreateDate desc")){ 
            <h2>@page.appName</h2>
               <p>@page.appDescription</p>

            @if (page.HasValue("mainImage")){                                         
                var dynamicMediaItem = Umbraco.Media(page.mainImage);
                <img src="@dynamicMediaItem.umbracoFile" alt="@dynamicMediaItem.Name"/>
            }
        }        
        
    </ul>   

    For the image I assume that you´re using the media picker datatype on the document type to choose the image. If that´s the case remember to change the mainImage to the alias of your media picker on the document type.

    And I make a check so I only print the image tag out if there are an image tetch to the page. You can find the documentation about the media picker and the other build in property editors here: http://our.umbraco.org/documentation/using-umbraco/backoffice-overview/property-editors/ There are both versions for 6 and 7, In Umbraco v6 (and v4) a Property Editor is defined in C# by a developer and compiled into a DLL. In Umbraco v7 a Property Editor is defined in a JSON manifest file and associated JS files.

    But as you can see you can still use the version 6 property edtiors in version 7. In version 7 with the media picker you can pick multiple items if that you case, then see the documentation here: http://our.umbraco.org/documentation/using-umbraco/backoffice-overview/property-editors/Built-in-Property-Editors-v7/Media-Picker

    But if you just shall pick one image you can use this documentation for the media picker datatype: http://our.umbraco.org/documentation/using-umbraco/backoffice-overview/property-editors/Built-in-Property-Editors/Media-Picker

    So as you can see I would collect all the code in one razor macro and then just add it to the parital view where it should be used, like i show you in the previous post:

    @Umbraco.RenderMacro("macroName")

    Hope this helps and make sense,

    /Dennis

    Copy Link
  • Filip Nemecek 7 posts 48 karma points
    Jul 01, 2014 @ 23:44
    Filip Nemecek
    0

    Dennis thanks, this is smart solution! I added the code from my macro to my partial view and it works.

    My final code in case somebody else would want to accomplish similar thing.

    <ul>
    @* OrderBy() takes the property to sort by and optionally order desc/asc *@

    @foreach (var page in CurrentPage.Children.Where("Visible").OrderBy("CreateDate desc"))
    {           
        <h2>@page.appName</h2>
        <p>@page.appDescription</p>

        if(page.HasValue("appScreenshots"))
        {                   
            var media = Umbraco.Media(page.appScreenshots);             

            @foreach(var photo in media.Children)
            {
                <li>
                <img src="@photo.umbracoFile" />
                </li>               
            }

        }           
    }
</ul>
    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft