Copied to clipboard

Flag this post as spam?

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


  • Steve 472 posts 1216 karma points
    Apr 08, 2015 @ 16:58
    Steve
    0

    If Else Behaving Strange

    I have a Razor script that is rendering html and including various doctype properties within the html. I have been trying to wrap some of the div's within tags that contanin the property for the url on the doctype, but when I do this it doesn't clost the tag in the correct place even though it clearly is in the correct spot within my Razor. Could someone take a look at this and help me figure this out please? Here is my page and my Razor:

    https://edit-wwwprep.rose-hulman.edu/about/leadership/presidents-office-(new).aspx

    There are three "featureBox"s and when I add an inline link on the actual umbraco page within the "featureBox1Content" rich text area, it ends the "featureBox" wrapping tag too early. I don't see how this is possible. Help would be appreaciated greatly.

    @inherits umbraco.MacroEngines.DynamicNodeContext
    
    @{
            var page = Model.AncestorOrSelf("PresidentsHomePage");
    
    }
    
    @if(page.HasValue("featureBox1Content") && page.HasValue("featureBox2Content") && page.HasValue("featureBox3Content")){
    
    <div id="featureBoxWrap">
            @if(page.HasValue("featureBox1Url")){
                var node = Library.NodeById(@Model.featureBox1Url);
    
            <a class="featureBox"  href="@node.Url" >
                @if(page.HasValue("featureBox1Headline")){
                        <div class="featureHeadline">
                            @page.featureBox1Headline
                            <hr>
                        </div>
                }   
    
                @if(page.HasValue("featureBox1Image")){
                    var imageBox1 = @Model.Media("featureBox1Image");
                        <div class="featureImage">
                            <img src="/[email protected]&width=263" />
                        </div>
                }
    
                @if(page.HasValue("featureBox1Content")){
                        <div class="featureContent">
                            @page.featureBox1Content
                        </div>
                }
            </a>
            } else {
    
            <div class="featureBox">
                @if(page.HasValue("featureBox1Headline")){
                    <div class="featureHeadline">
                        @page.featureBox1Headline
                        <hr>
                    </div>
                }   
    
                @if(page.HasValue("featureBox1Image")){
                    var imageBox1 = @Model.Media("featureBox1Image");
                        <div class="featureImage">
                            <img src="/[email protected]&width=263" />
                        </div>
                }
                @if(page.HasValue("featureBox1Content")){
                        <div class="featureContent">
                            @page.featureBox1Content
                        </div>
                }   
            </div>
                    }
    
            @if(page.HasValue("featureBox2Url")){
                    var node = Library.NodeById(@Model.featureBox2Url);
                        <a class="featureBox" href="@node.Url">
    
                @if(page.HasValue("featureBox2Headline")){
                        <div class="featureHeadline">
                            @page.featureBox2Headline
                            <hr>
                        </div>
                }   
                @if(page.HasValue("featureBox2Image")){
                    var imageBox2 = @Model.Media("featureBox2Image");
                        <div class="featureImage">
                            <img src="/[email protected]&width=263" />
                        </div>
                }
                @if(page.HasValue("featureBox2Content")){
                        <div class="featureContent">
                            @page.featureBox2Content
                        </div>
                }   
                            </a>
            } else {
    
            <div class="featureBox">
                @if(page.HasValue("featureBox2Headline")){
                        <div class="featureHeadline">
                            @page.featureBox2Headline
                            <hr>
                        </div>
                }   
                @if(page.HasValue("featureBox2Image")){
                    var imageBox2 = @Model.Media("featureBox2Image");
                        <div class="featureImage">
                            <img src="/[email protected]&width=263" />
                        </div>
                }
                @if(page.HasValue("featureBox2Content")){
                    <div class="featureContent">
                        @page.featureBox2Content
                    </div>
                }   
            </div>
    
                }
    
            @if(page.HasValue("featureBox3Url")){
                    var node = Library.NodeById(@Model.featureBox3Url);
                        <a class="featureBox" href="@node.Url">
    
                @if(page.HasValue("featureBox3Headline")){
                    <div class="featureHeadline">
                        @page.featureBox3Headline
                        <hr>
                        </div>
                }   
                @if(page.HasValue("featureBox3Image")){
                    var imageBox3 = @Model.Media("featureBox3Image");
                        <div class="featureImage">
                        <img src="/[email protected]&width=263" />
                        </div>
                }
                @if(page.HasValue("featureBox3Content")){
                    <div class="featureContent">
                        @page.featureBox3Content
                        </div>
                }   
                    </a>
            } else {
    
            <div class="featureBox">
                @if(page.HasValue("featureBox3Headline")){
                    <div class="featureHeadline">
                        @page.featureBox3Headline
                        <hr>
                    </div>
                }   
                @if(page.HasValue("featureBox3Image")){
                    var imageBox3 = @Model.Media("featureBox3Image");
                    <div class="featureImage">
                        <img src="/[email protected]&width=263" />
                    </div>
                }
                @if(page.HasValue("featureBox3Content")){
                    <div class="featureContent">
                        @page.featureBox3Content
                    </div>
                }   
            </div>
                    }
        </div>            
    
    }

     

     

  • Steve 472 posts 1216 karma points
    Apr 09, 2015 @ 17:17
    Steve
    0

    It appears that it has to do with the rich text editor, but I don't know why. When you add any <a> tag within a rich text editor property on the page Umbraco is including it in the first test for "featureBoxUrl" and creates a duplicate <a> tag with the class of "featureBox", which is a floated item, so the layout is then broken. There may be other things going on, but I don't know why. I would really appreaciate someone trying to recreate this error as I think its a bug. 

  • Justin 19 posts 163 karma points
    Apr 19, 2015 @ 02:54
    Justin
    100

    Hi Steve,

    If i understand correctly you have created featureBox1Content with an <a> tag which links to an umbraco page, but your featureBox1Content is wrap inside of an <a> tag in your code.

    Assuming featureBox1Conent is the following:

    <a href="myLink.html">link to page</a>
    

    And you Have

           <a class="featureBox"  href="@node.Url" >
            @if(page.HasValue("featureBox1Content")){
                    <div class="featureContent">
                        @page.featureBox1Content
                    </div>
            }
        </a>
    

    Your Output will be:

    <a class=featureBox" href="link/to/nodeurl" >
        <a href="myLink.html">link to page</a>
    </a>
    

    You end up with nested anchors which is invalid HTML.

    Hope this helps

  • Steve 472 posts 1216 karma points
    Apr 20, 2015 @ 14:20
    Steve
    0

    Ahh! Thanks Justin! I can't believe I didn't even think of that!

    So, is Umbraco stripping out one of the a tags, because when it generates the page it is missing the second starting <a> tag? Just curious.

  • Justin 19 posts 163 karma points
    Apr 23, 2015 @ 01:43
    Justin
    0

    Hi Steve,

    I don't think it is umbraco stripping anything out. I'd say it's probably the Razor Render Engine getting it's knickers in a twist.

    Glad i can help :) Can you mark this as solved please.

    cheers

Please Sign in or register to post replies

Write your reply to:

Draft