How to tell where a partial view is in the hierarchy and conditionally apply styles
I have a TextBlock partial that renders some rich text.
A TextBlock can appear in one of two places in the page hierarchy.
1: Page Level, so the hierarchy would be
Page<-BlockList<-BlockListItem<-TextBlock
Inside a more complicated nested component structure like
Page <-BlockList<-Accordion<-TextBlock
The task at hand is to conditionally add a CSS class to the TextBlock when the TextBlock is at Page Level not at the other level.
I believe that the Ancestor() or AncestorsOrSelf() methods might let me test the immediate parent nodes or get at the -2 node assuming that's the page level node, but I just can't seem to call these methods in the debugger.
In the TextBlock partial when I debug,
Model is of type BlockListItem
I've imported Umbraco.Cms.Core.Models.PublishedContent at the top of the partial assuming that's where Ancestor or AncestorsOrSelf come from.
When I tried to access Model.Ancestor() or Model.Content.Ancestor() in the debugger, I got the error "IPublishedElement does not contain definition for Ancestor and the best extension method overload requires a receive of type IPublishedContent.
Some I'm guessing I need a cast maybe or I just can't do this from a partial.
Unfortunately it would be quite a challenge to handle it in the manner you are after. This is because BlockList items have no knowledge of their parent/ancestors as they aren't part of a "tree" persay.
However, as Huw mentions, this would be better handled purely in CSS.
For example, your pages could have a "Page" class added to the body,
Then all your Rich Text Blocks could have "Text-Block" as a class.
Accordion blocks could then have a "Accordion-Block" class.
using this you could use the CSS principles to apply styles to the different text-blocks without the need to add additional classes.
How to tell where a partial view is in the hierarchy and conditionally apply styles
I have a TextBlock partial that renders some rich text.
A TextBlock can appear in one of two places in the page hierarchy.
1: Page Level, so the hierarchy would be
Page<-BlockList<-BlockListItem<-TextBlock
Page <-BlockList<-Accordion<-TextBlock
The task at hand is to conditionally add a CSS class to the TextBlock when the TextBlock is at Page Level not at the other level.
I believe that the Ancestor() or AncestorsOrSelf() methods might let me test the immediate parent nodes or get at the -2 node assuming that's the page level node, but I just can't seem to call these methods in the debugger.
In the TextBlock partial when I debug,
Model is of type BlockListItem
I've imported Umbraco.Cms.Core.Models.PublishedContent at the top of the partial assuming that's where Ancestor or AncestorsOrSelf come from.
When I tried to access Model.Ancestor() or Model.Content.Ancestor() in the debugger, I got the error "IPublishedElement does not contain definition for Ancestor and the best extension method overload requires a receive of type IPublishedContent.
Some I'm guessing I need a cast maybe or I just can't do this from a partial.
you should be able to do this purely with css selectors no need to involve code.
Hi Ian,
Unfortunately it would be quite a challenge to handle it in the manner you are after. This is because BlockList items have no knowledge of their parent/ancestors as they aren't part of a "tree" persay.
However, as Huw mentions, this would be better handled purely in CSS.
For example, your pages could have a "Page" class added to the body, Then all your Rich Text Blocks could have "Text-Block" as a class. Accordion blocks could then have a "Accordion-Block" class.
using this you could use the CSS principles to apply styles to the different text-blocks without the need to add additional classes.
is working on a reply...
This forum is in read-only mode while we transition to the new forum.
You can continue this topic on the new forum by tapping the "Continue discussion" link below.