Copied to clipboard

Flag this post as spam?

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


  • Anders Brohus 194 posts 475 karma points
    Dec 31, 2014 @ 12:08
    Anders Brohus
    0

    From Scripting Files to Partial View problems

    Hi!

    I need some help after i choose to upgrade to Umbraco 7.2.1, because the scripting files are gone! So i have to convert them into a Partial View Macro, but i really got some big problems..

    Because my Navigation Macro is not working 100% anymore :/

    This is my navigation scripting file

    @inherits umbraco.MacroEngines.DynamicNodeContext
    @{ 
        @*Get the root of the website *@
        var root = Model.AncestorOrSelf(1);
    }
    
    <ul class="nav navbar-nav">
        <li class="@Model.IsEqual(root, "active", "")"><a href="/">Home</a></li>
    
        @foreach(var page in root.Children.Where("Visible"))
        { 
            if(page.Children.Where("Visible").Count() > 0)
            {
                <li class="@page.IsAncestorOrSelf(Model, "active", "")">
                    <a href="@page.Url">@page.Name</a>
                </li>
            }
            else
            {
                <li class="@page.IsAncestorOrSelf(Model, "active", "")">
                    <a href="@page.Url">@page.Name</a>
                </li>
            }
        }
    </ul>
    

    And it makes my menu and sets a class (active) on the li if it's on the right page.

    BUT when i tried to convert it into a Partial View then it stopped setting active on the li elements, it works on the "Home" Element but not the ones that are generated :/

    @inherits Umbraco.Web.Macros.PartialViewMacroPage
    @{ 
        @*Get the root of the website *@
        var root = CurrentPage.AncestorOrSelf(1);
    }
    
    <ul class="nav navbar-nav">
        <li class="@CurrentPage.IsEqual(root, "active", "")"><a href="/">Home</a></li>
    
        @foreach(var page in root.Children.Where("Visible"))
        { 
            if(page.Children.Where("Visible").Count() > 0)
            {
                <li class="@page.IsAncestorOrSelf(Model, "active", "")">
                    <a href="@page.Url">@page.Name</a>
                </li>
            }
            else
            {
                <li class="@page.IsAncestorOrSelf(Model, "active", "")">
                    <a href="@page.Url">@page.Name</a>
                </li>
            }
        }
    </ul>
    

    Second problem is i can't figure out to get images from the Media Picker out in the macro! :/

    Because i got this macro for my "News", where it takes out all the "NewsPosts", and display them with image and all but i wont work.. :/

    My scripting file that works..

    @inherits umbraco.MacroEngines.DynamicNodeContext
    
    @{
        @*Make Query to find all nodes with Alias "NewsPost" *@
        var selection = Model.AncestorOrSelf().Descendants("NewsPost").Where("Visible");
    }
    @if(selection.Any()){
    
        @* OrderBy() takes the property to sort by and optinoally order desc/asc *@
        foreach (var page in selection.OrderBy("CreateDate desc"))
        {
            <div class="col-md-4 NewsPost">
                <article>
                @if (page.newsImage != "")
                {<a href="@page.Url"><div class="NewsImage"><img src="@Model.MediaById(page.newsImage).umbracoFile" alt="@page.title"/></div></a>}
                else
                {
                    <div style="width:350px; height:233px;"></div>
                }
                    <a href="@page.Url"><h2 style="margin-top:2px">@page.title</h2></a>
                    <small>@page.CreateDate.ToString("dd MMMM yyyy") - @page.CreateDate.ToString("H:mm") </small>
                    <div class="ShortText">
                        @(Library.Truncate(Library.StripHtml(page.bodyText), 300, true))
                    </div>
                    <br />
                    <b><a href="@page.Url"> @Dictionary.ReadMore &#8594;</a></b>
                </article>
            </div>
        }
    }
    

    And i can't get it to work even when the image is not there... It's driving me crazy that i can't get it to work xD

  • Dennis Aaen 4500 posts 18255 karma points admin hq c-trib
    Dec 31, 2014 @ 12:36
    Dennis Aaen
    0

    Hi Anders,

    I would try to help you. For the script for the navigation I think that you only are missing a very small part, so instead of Model you need to use CurrentPage. like this

    @inheritsUmbraco.Web.Macros.PartialViewMacroPage
    @{
       
    @*Get the root of the website *@
       
    var root = CurrentPage.AncestorOrSelf(1);
    }

    <ul class="nav navbar-nav">
       
    <li class="@CurrentPage.IsEqual(root, "active", "")"><a href="/">Home</a></li>

       
    @foreach(var page in root.Children.Where("Visible"))
       
    {
           
    if(page.Children.Where("Visible").Count()>0)
           
    {
               
    <li class="@page.IsAncestorOrSelf(CurrentPage, "active", "")">
                   
    <a href="@page.Url">@page.Name</a>
               
    </li>
           
    }
           
    else
           
    {
               
    <li class="@page.IsAncestorOrSelf(CurrentPage, "active", "")">
                   
    <a href="@page.Url">@page.Name</a>
                </
    li>
           
    }
       
    }
    </ul>

    For the next code snippet about the media picker, then you could try this.I have made my changes bold

    @inheritsUmbraco.Web.Macros.PartialViewMacroPage
    @{
        @*Make Query to find all nodes with Alias "NewsPost" *@
        var selection = CurrentPage.AncestorOrSelf().Descendants("NewsPost").Where("Visible");
    }
    @if(selection.Any()){

        @* OrderBy() takes the property to sort by and optinoally order desc/asc *@
        foreach (var page in selection.OrderBy("CreateDate desc"))
        {
            <div class="col-md-4 NewsPost">
                <article>
                @if (page.newsImage != "")
                {<a href="@page.Url"><div class="NewsImage">
                    var dynamicMediaItem = Umbraco.Media(page.newsImage);
                    <img src="@dynamicMediaItem.umbracoFile" alt="@page.title"/></div></a>}
                else
                {
                    <div style="width:350px; height:233px;"></div>
                }
                    <a href="@page.Url"><h2 style="margin-top:2px">@page.title</h2></a>
                    <small>@page.CreateDate.ToString("dd MMMM yyyy") - @page.CreateDate.ToString("H:mm") </small>
                    <div class="ShortText">
                        @(Umbraco.Truncate(Umbraco.StripHtml(page.bodyText), 300, true))
                    </div>
                    <br />
                    <b><a href="@page.Url">@Umbraco.GetDictionaryValue("ReadMore") &#8594;</a></b>
                </article>
            </div>
        }
    }

    As you can see I made so change to your could. Try to see the documentation for the Media picker here. http://our.umbraco.org/documentation/Using-Umbraco/Backoffice-Overview/Property-Editors/Built-in-Property-Editors/Media-Picker Only focus on the strongly typed and dynmic, I use this syntaxs if you only need one image, but in Umbraco 7 you can add multiple images to the the media picker see here: http://our.umbraco.org/documentation/using-umbraco/backoffice-overview/property-editors/Built-in-Property-Editors-v7/Media-Picker

    Next this is the old Library method in MVC this is replaced by @Umbraco take a look here: http://our.umbraco.org/documentation/Reference/Querying/UmbracoHelper/#Truncate%28stringhtmlintlengthbooladdElipsis%29

    The last thing is the dictonary in MVC you need to call your dictionary like [email protected](string key) Where the string key is the name of your dictionary item, and this name must be unqiue.

    Hope this helps,

    /Dennis

  • Anders Brohus 194 posts 475 karma points
    Dec 31, 2014 @ 13:14
    Anders Brohus
    0

    Thanks Dennis!

    Now my navigation works... I just tried Model to CurrentPage yesterday, but yeah.. Maybe it was an error another place them :P

    But i still get the "Error loading Partial View script (file: ~/Views/MacroPartials/List News Posts.cshtml)" on the news post, but i figured out that the image is still causing problems because when i remove the If Else statements it's working now! :D

    And it should have been proofed so that if there is no image then it just makes an empty div :/

  • Dennis Aaen 4500 posts 18255 karma points admin hq c-trib
    Dec 31, 2014 @ 14:04
    Dennis Aaen
    0

    Hi Anders,

    I think I found what the problem is. The first thing is that I missing the space between @inherits and  Umbraco.Web.Macros.PartialViewMacroPage in the first line, so instead of

    @inheritsUmbraco.Web.Macros.PartialViewMacroPage

    Change it to:

    @inherits Umbraco.Web.Macros.PartialViewMacroPage

    And I have missing a small thing, when you are in HTML you need to start the Razor engine again and the way you doing this is by @, so try this code new code.

    @inherits Umbraco.Web.Macros.PartialViewMacroPage
    @{
        @*Make Query to find all nodes with Alias "NewsPost" *@
        var selection = CurrentPage.AncestorOrSelf().Descendants("NewsPost").Where("Visible");
    }
    @if(selection.Any()){

        @* OrderBy() takes the property to sort by and optinoally order desc/asc *@
        foreach (var page in selection.OrderBy("CreateDate desc"))
        {
            <div class="col-md-4 NewsPost">
                <article>
                @if (page.newsImage != ""){
                    <a href="@page.Url"><div class="NewsImage">
                        @{
                            var dynamicMediaItem = Umbraco.Media(page.newsImage);
                        }
                    <img src="@dynamicMediaItem.umbracoFile" alt="@page.title"/></div></a>}
                else
                {
                    <div style="width:350px; height:233px;"></div>
                }
                    <a href="@page.Url"><h2 style="margin-top:2px">@page.title</h2></a>
                    <small>@page.CreateDate.ToString("dd MMMM yyyy") - @page.CreateDate.ToString("H:mm") </small>
                    <div class="ShortText">
                        @(Umbraco.Truncate(Umbraco.StripHtml(page.bodyText), 300, true))
                    </div>
                    <br />
                    <b><a href="@page.Url">@Umbraco.GetDictionaryValue("ReadMore") &#8594;</a></b>
                </article>
            </div>
        }
    }

    Again I have made the changes bold so you can see what is changed.

    Hope this helps,

    /Dennis

  • Anders Brohus 194 posts 475 karma points
    Dec 31, 2014 @ 14:26
    Anders Brohus
    0

    Hi Dennis

    I found out of that pretty quick, i just looked at it :)

    It just still gives me errors!?!

    That's why i hate Partial Views... I have working examples of scripting files that handles it without any problems, so i just cant figure out whats wrong... They should have removed XLST instead of Scripting files :-'(

  • Dennis Aaen 4500 posts 18255 karma points admin hq c-trib
    Dec 31, 2014 @ 14:47
    Dennis Aaen
    100

    Hi Anders,

    I think I have made a working example code for you.

    Try this code an see if it works.

    @inherits Umbraco.Web.Macros.PartialViewMacroPage

    @{
        @*Make Query to find all nodes with Alias "NewsPost" *@
        var selection = CurrentPage.AncestorOrSelf().Descendants("umbNewsItem").Where("Visible");
    }
    @if(selection.Any()){

        @* OrderBy() takes the property to sort by and optinoally order desc/asc *@
        foreach (var page in selection.OrderBy("CreateDate desc"))
        {
            <div class="col-md-4 NewsPost">
                <article>
               
                @if (page.HasValue("newsImage")){                                        
                    var dynamicMediaItem = Umbraco.Media(page.newsImage);
                    <a href="@page.Url"><div class="NewsImage">
                    <img src="@dynamicMediaItem.umbracoFile" alt="@page.title"/>
                    </div></a>
                }else{
                    <div style="width:350px; height:233px;"></div>

                }
               
               
                <a href="@page.Url"><h2 style="margin-top:2px">@page.title</h2></a>
                    <small>@page.CreateDate.ToString("dd MMMM yyyy") - @page.CreateDate.ToString("H:mm") </small>
                    <div class="ShortText">
                        @(Umbraco.Truncate(Umbraco.StripHtml(page.bodyText), 300, true))
                    </div>
                    <br />
                    <b><a href="@page.Url">@Umbraco.GetDictionaryValue("ReadMore") &#8594;</a></b>

                </article>
            </div>
        }
    }

    The way you can test if a field has a value in MVC is like @CurrentPage.HasValue("propertyAlias")

    Hope this helps,

    /Dennis

  • Anders Brohus 194 posts 475 karma points
    Dec 31, 2014 @ 15:22
    Anders Brohus
    0

    Yey it's working now, after i changed a little! :D

    Thanks you so much, now i just need some styling :P

    Happy New Year! :)

  • Dennis Aaen 4500 posts 18255 karma points admin hq c-trib
    Dec 31, 2014 @ 15:35
    Dennis Aaen
    0

    Hi Anders,

    Glad that I could help you, and happy new year to you too.

    /Dennis

Please Sign in or register to post replies

Write your reply to:

Draft