Copied to clipboard

Flag this post as spam?

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


  • Gibran Shah 69 posts 240 karma points
    May 30, 2019 @ 02:59
    Gibran Shah
    0

    Can't get photo info when looping through child content

    Hello,

    I'm trying to bring an image onto the page and it's not working.

    Here is the code in the template:

    @foreach (var person in Model.Content.Children()) {
            var content = Umbraco.Content(person.Id);
            var photo = Umbraco.TypedMedia(content.photo);
            <div class="personDetails">
                @content.photo<br/>
                @photo<br/>
                @content.name, @content.title<br/>
                @content.email<br/>
                @content.phoneNumber
            </div>
        }
    

    What this is is a Personnel page. It lists a bunch of Persons:

    enter image description here

    enter image description here

    enter image description here

    The foreach loops goes through each Person and prints out their information. I'm trying to print out some information on the photo by getting it from TypedMedia:

    var photo = Umbraco.TypedMedia(content.photo);
    ...
    @photo<br/>
    

    I realize this won't display the photo but I was hoping to display some information on the photo at least, maybe a url.

    I was able to do this with another content like this:

    @{
      var roverUrl = Umbraco.TypedMedia(Model.Content.RoverPic.Id).Url;
    }
    
    <img id="roverImage" src="@roverUrl" alt="Range Rover" />
    

    ...but this isn't working on the Personnel page. The difference is that I'm trying to get the photo from a child content of the Personnel content, whereas with the rover pic, it was just a property of the content.

    Please help and thank you.

  • Niels Odgaard 14 posts 155 karma points
    May 30, 2019 @ 07:52
    Niels Odgaard
    0

    Hi Gibran,

    I don't think you need to use Umbraco.TypedMedia as your photo is just a property on the already loaded child item. You should be able to show the image if you just put the url into the src on a img tag like this:

    @foreach (var person in Model.Content.Children()) {
        var content = Umbraco.Content(person.Id);
        <div class="personDetails">
            <img src="@content.photo.Url" /><br/>
            @content.name, @content.title<br/>
            @content.email<br/>
            @content.phoneNumber
        </div>
    }
    
  • Gibran Shah 69 posts 240 karma points
    May 30, 2019 @ 23:09
    Gibran Shah
    0

    I figured out what the problem is. Not all my Persons have a photo. When they do have a photo, typing content.photo in the Visual Studio immediate window gives me this:

    {1527}
    Children: The function evaluation requires all threads to run.
    Content: Content Id: 1527, Name: "Me"
    ContentSet: The function evaluation requires all threads to run.
    ContentType: {Umbraco.Core.Models.PublishedContent.PublishedContentType}
    CreateDate: {5/29/2019 8:06:50 PM}
    CreatorId: 1
    CreatorName: ""
    DocumentTypeAlias: "Image"
    DocumentTypeId: 1032
    Id: 1527
    IsDraft: false
    ItemType: Media
    Level: 2
    Name: "Me"
    Parent: The function evaluation requires all threads to run.
    Path: "-1,1526,1527"
    Properties: Count = 12
    SortOrder: 0
    TemplateId: 0
    UmbracoBytes: "34886"
    UmbracoExtension: "jpg"
    UmbracoFile: {/media/1042/me.jpg}
    UmbracoHeight: "138"
    UmbracoWidth: "120"
    UpdateDate: {5/29/2019 8:06:50 PM}
    Url: "/media/1042/me.jpg"
    UrlName: "me"
    Version: {00000000-0000-0000-0000-000000000000}
    WriterId: 1
    WriterName: "Gibran Shah"
    

    You can see the Url field.

    When they don't have a photo, it gives me this:

    {Umbraco.Core.Udi[0]}
    

    I tried checking content.photo for null before getting the Url, but {Umbraco.Core.Udi[0]} is not null.

    How would I detect when content.photo has a field called Url and when it doesn't?

  • Gibran Shah 69 posts 240 karma points
    May 31, 2019 @ 02:25
    Gibran Shah
    100

    So here is the full solution to the problem:

    var photoUrl = "";
    if (content.photo.GetType().FullName == "Umbraco.Web.PublishedContentModels.Image")
            {
                photoUrl = content.photo.Url;
            }
    

    If there is a photo, then content.photo will be a Umbraco.Web.PublishedContentModels.Image. Otherwise, it will be a Umbraco.Core.Udi[].

Please Sign in or register to post replies

Write your reply to:

Draft