Copied to clipboard

Flag this post as spam?

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


  • Henrik 11 posts 61 karma points
    Nov 24, 2020 @ 10:13
    Henrik
    0

    Nested Content: How do i render individual items separately?

    I find it hard to understand https://our.umbraco.com/documentation/getting-started/backoffice/property-editors/built-in-property-editors/Nested-Content/ when i have multiple items with individual sets of properties.

    I would like to wrap each NC item in custom markup and handle each property specifically but the example just handles each property type.

    Is there a way to get the item alias so i can do conditional styling for each item?

    I am using the UAAS node client with VSCode so i don't have intellisense to help me so i rely on the documentation which i find very thin.

  • Patrick van Kemenade 63 posts 257 karma points
    Nov 24, 2020 @ 19:22
    Patrick van Kemenade
    0

    Using a foreach loop you go through all items in you collection I assume.

    The problem your having that you have multi types of item classes, for instance you have a a collection called TransportUnits containing item of type Car and Boat and you want to render them differently in your loop, is this the question ?

    In that using the type (note by adding multiple composition you can influence the interfaces being used) and check on it you can make the disticntion.

    Like: foreach(var item in collection) { if(item is ICar) { // Render Car stuff } }

  • Henrik 11 posts 61 karma points
    Nov 24, 2020 @ 19:26
    Henrik
    0

    Yes i am using a foreach loop but i haven't found a way to identify each individual element so i can do :

    foreach

    • If car { special markup for car}
    • If boat { special markup for boat}

    }

  • Amir Khan 1186 posts 2533 karma points
    Nov 24, 2020 @ 20:58
    Amir Khan
    2

    I think this will help you, create separate partials for car, boat, etc. and name them based on the document type alias, then you can do this in your template, where 'content" is a nested content "picker" on the template document type and "Nested" is a folder within the Views/Partials folder:

    <div class="body-content-wrapper">
        @{
            var content = Model.Content.GetPropertyValue<IEnumerable<IPublishedContent>>("content");
    
            if(content != null) {
                    <div>
                    @foreach (var contentItem in content) {
                        var partialViewName = "Nested/"+contentItem.DocumentTypeAlias;
                        @(Html.Partial(partialViewName, contentItem))
                    }
                    </div>
            }
        }
    </div>
    
  • Patrick van Kemenade 63 posts 257 karma points
    Nov 24, 2020 @ 21:34
    Patrick van Kemenade
    1

    Think Amir solution is a good one, an alternative to this solution and what I often like to use, don't know which one is best, just see what suits you.

    I would create a general CompositeType Vehicle, a composite CarDetails and and composite BoatDetails. So then you create a documenttype (elementonly) Car based on Vehicele + CarDetails and one a Boat on Vehicle + BoatDetails.

    When you have model set to AppData or LiveAppData you can see that using a Composite in a DocumentType translates to implementing this interface on the class.

    This way you don't have to use hardcoded string like ("content")

    And you can do

    foreach(var item in (List<IVehicle)collection){
    if(item is ICar){ .... }
    if(item is IBoatDetails){...}
    }
    
  • Amir Khan 1186 posts 2533 karma points
    Nov 24, 2020 @ 21:38
    Amir Khan
    0

    That's smart too and IDK which is better either. The thing I liked about our approach is having the partials be named the same as the doctype alias so they "just work", like creating templates when you create doctypes.

    I hadn't thought about your point on having "content" hardcoded and that def makes sense. Great thing about Umbraco is so many ways to do things depending on how you work.

  • Henrik 11 posts 61 karma points
    Nov 25, 2020 @ 08:45
    Henrik
    0

    Thank you all for the great input.

    I got it running now :)

Please Sign in or register to post replies

Write your reply to:

Draft