Copied to clipboard

Flag this post as spam?

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


  • Matt 200 posts 515 karma points
    1 week ago
    Matt
    0

    cant render image inside of html?

    Hi

    I'm trying to add a media picker to my html template but for some reason it doesnt like it inside the divs?

    Here is my code;

    @inherits Umbraco.Web.Mvc.UmbracoViewPage
    
    
    @{
        var selection = Umbraco.Content(Guid.Parse("86acfb75-8edc-4d6d-933d-d8c8f555c57a"))
        .ChildrenOfType("newsItem")
        .Where(x => x.IsVisible())
        .OrderByDescending(x => x.CreateDate)
        .Take(4);
    }
    
    
      <div class="latest-news">
        <div class="div-block-4">
          <h3 class="latest-news-heading">Latest news</h3>
        </div>
        <div class="news-container">
          <div class="w-row">
    
              @foreach(var item in selection){
            <div class="w-col w-col-3">
              <div class="news-item-wrapper">
                var newsImage = item.Value<IPublishedContent>
                ("newsImage");
                    if (newsImage != null)
                    {
                     <img src="@newsImage.Url" height="300" width="447">
                     }
                 }
                <div class="news-date">
                  <div class="news-date-text">@item.CreateDate.ToString("dd MMMM yyyy")</div>
                </div>
                <div class="paragraph">@item.Value("newsTitle")</div>
              </div>
            </div>
    }
    
          </div>
        </div>
      </div>
    

    Which displays the following error;

    Compiler Error Message: CS0103: The name 'newsImage' does not exist in the current context

    However if I add my mediapicker code just before the closing } it displays, but not where I want the code.

    What am I doing wrong?

    Thanks

    Matt

  • Marc Goodson 977 posts 6525 karma points MVP 4x c-trib
    1 week ago
    Marc Goodson
    100

    Hi Matt

    It's can be really hard with razor to determine whether a line is html or content or code, but if you start writing some html, then usually you need to start a code block again

    @{} to let the parser know you want to do a bit of code

    so I think what was happening here is your var newsImage line was not being intepreted as code, whereas if you move that to the first line after the foreach, before you have written out any html, then it should be!

          @foreach(var item in selection){
            var newsImage = item.Value<IPublishedContent>("newsImage");
        <div class="w-col w-col-3">
          <div class="news-item-wrapper">
                @if (newsImage != null)
                {
                 <img src="@newsImage.Url" height="300" width="447">
                 }
    
            <div class="news-date">
              <div class="news-date-text">@item.CreateDate.ToString("dd MMMM yyyy")</div>
            </div>
            <div class="paragraph">@item.Value("newsTitle")</div>
          </div>
        </div>
    }
    
  • Matt 200 posts 515 karma points
    1 week ago
    Matt
    0

    Thanks Marc, that did the trick! appreciate the fast response.

Please Sign in or register to post replies

Write your reply to:

Draft