Umbraco AncestorOrSelf missing from Model? - razor

I have a news list under which there are a load of News Items. I'm trying to get the page name of the news list to display on each news item but this code isn't cutting it. I get an error saying "Umbraco.Web.Models.RenderModel' does not contain a definition for 'AncestorOrSelf'"
I want this to use levels rather than nodeID so it's reuseble on other pages. This is what I've got so far:-
#inherits Umbraco.Web.Mvc.UmbracoTemplatePage
#{
Layout = "BasePage.cshtml";
var sectionTitle = Model.AncestorOrSelf(2).pageName;
}
<div id="contentHeader">
<div class="row contentHeader">
<div class="col-md-6 page-title no-left-pad">
<h1>#sectionTitle</h1>
</div>
<div class="col-md-6 no-right-pad">
Use our CareFinder
</div>
</div>
</div>
#RenderBody()
Any advice appreciated as I can't find any reason for the error anywhere.
Thanks

I think what you should be looking for is:
Model.Content.AncestorOrSelf(2).Name
Model returns a RenderModel object but what you want is the IPublishedContent object which you will find in the Model.Content property.
You should of course perform a null check before attempting to access the name e.g.
if(Model.Content.AncestorOrSelf(2) != null)
{
sectionTitle = Model.Content.AncestorOrSelf(2).Name;
}

Try using
Model.Content.AncestorOrSelf or Model.Content.AncestorsOrSelf
The available input variables are int (level) and string (NodeTypeAlias)

Related

Array of calendars with ViewChildren?

I need to create a dynamic full-calendar array.
The idea is that the user can select one of "n" diaries, relating to different operators, which are shown to him at the same time.
I'm using Angular 9.
Of course... it doesn't seem to work...
My .ts file has this declaration...
#ViewChildren(FullCalendarComponent) fullCalendars: FullCalendarComponent[];
public calendarOptions: CalendarOptions = null;
...and I use the component in this way...
render() {
if (this.fullCalendars && this.fullCalendars.length > 0) {
this.fullCalendars.forEach(fc => fc.getApi().render());
}
}
... and this is the HTML part ...
<div class="card" *ngFor="let ag of agendas; let i = index">
<div class="card-header">
<b>{{ ag.description }}</b>
</div>
<div class="card-body">
<full-calendar #fullCalendars [options]="calendarOptions"> </full-calendar>
</div>
</div>
Is this correct? I'm trying to understand why I'm getting this error...
Cannot read properties of undefined (reading '0')
...but first I need to know if the above code is ok.
Thank you so much!

Why don't the String values get displayed as HTML tags using innerHTML?

I get string data from my database to my variable, I want to display them as HTML tags by [innerHTML], but it doesn't work.
The variable is displayed on string instead HTML Tags.
I tried to use with DomSanitizer but it don't work:
article:Article[];
(article.articlesTitleHtml:SafeHtml;)
in the function:
this.article.forEach(elementArticle => {
elementArticle.articlesTitleHtml = this.sanitizer.bypassSecurityTrustHtml(elementArticle.articleTitle)
});
in HTML page:
<div *ngFor="let item of articles">
<div id="{{item.articleId}}">
<h2 class="chart" [innerHTML]="item.articlesTitleHtml"></h2>
</div>
my code:
in Type Script:
articles:Article[];
ngOnInit() {
this.apiArticle.getArticleList().subscribe(data=>{
this.articles=data
})
in HTML page:
<div *ngFor="let item of articles">
<div id="{{item.articleId}}">
<h2 class="chart" [innerHTML]="item.articleTitle"></h2>
</div>
</div>
It should work, you can check here...
if you can share the type of data that you're dealing with, it will give more insight into the appropriate DomSanitizer method which should be called
in my example above, i used both bypassSecurityTrustHtml & bypassSecurityTrustUrl for the 2 different types of strings which needed sanitization

c# razor template with #Link.To renders the incorrect link

I have a template for the details view of a single product. In this template it lists the "tags" and "categories" with links to view products of the same tag or category.
I define the links for the tags and categories in the same way but they are rendered differently.
here is my template:
<link rel="stylesheet" href="#App.Path/assets/portfolio.css" data-enableoptimizations="bottom"/>
<div class="sc-element">
<div class="ks-portfolio-detail">
<div class="row">
<div class="col-sm-12 col-md-6">#Edit.Toolbar(Content)
<img src="#Content.Image" alt="#Content.UrlKey" class="img-responsive" />
</div>
<div class="col-sm-12 col-md-6">
<div class="ks-title"><h1>#Content.Title</h1></div>
...
<div class="ks-lable">Categories:</div>
#{ int count=0; }
#foreach(var item in AsDynamic(Content.Categories)){
count++;
#item.Title
#(count < Content.Categories.Count?" | ":"")
}
<br/><br/>
<div class="ks-lable">Tags:</div>
#{ int counter=0; }
#foreach(var item in AsDynamic(Content.Tags)){
counter++;
#item.Name
#(counter < Content.Tags.Count?" | ":"")
}
</div>
</div>
</div>
</div>
Please note the lines where the category and tag links are created:
#item.Title
...
#item.Name
PROBLEM
The tags Link.To renders the link with "slashes" like:
http://dnn804/portfolio/tag/Demo2
but the category renders the link like:
http://dnn804/portfolio?category=Flowers
QUESTION
Can someone help me figure out why these links are rendered differently when using the same function? I want them both to appear like the "tags" link.
Thanks in advance.
The Link.To uses the DNN-internal link resolution. I'm just going to guess that there are some terms that DNN maybe treats differently, causing special links. DNN does sometimes do strange things with links, just like on the home page, which is why we are using it.
That's just a guess though.
You could run some experiments like "cat=" instead of category, to validate this.

How can I get list of elements or data which are on same level with same attributes?

I have one web application which have one HTML page.
In this page structure is like this:
<div class = 'abc'>
<div class = 'pqr'>test1</div>
</div>
<div class = 'abc'>
<div class = 'pqr'>-</div>
</div>
<div class = 'abc'>
<div class = 'pqr'>-</div>
</div>
<div class = 'abc'>
<div class = 'pqr'>test2</div>
</div>
<div class = 'abc'>
<div class = 'pqr'>-</div>
</div>
Here I want to take data from test1 to test2.
I have tried xpath with [Node Number] But I have found all nodes at [1] level.
Is there any way to get all data or List of elements test1 to test2 with "-" ?
I have seen this kind of issue before.
You have to use following-sibling here.
First I use this type of xpath :
//div[text()='test1']/..//following-sibling::div[#class='pqr' and not(contains(text(),'test'))]
Then you need to change script. "Note : I have written code in JAVA"
Logic :
while(element found text = '-')
{
//get data here
}
Please try this approach.
I guess you want the following xpath :
(//div[#class='pqr'])[position()<=4]
Notice the brackets () before position() predicate.
output in xpath tester :
Element='<div class="pqr">test1</div>'
Element='<div class="pqr">-</div>'
Element='<div class="pqr">-</div>'
Element='<div class="pqr">test2</div>'
I think you can't use the Test1 and Test2 elements as identifiers because they are on the same line as the nodes you want to collect. Otherwise, I think you can use findElements(by.Xpath("patern_to_search")). that will return you a collection of elements that are matching your pattern.
one more way without using xpath:
List<WebElement> element = driver.findElements(By.className("pqr"));
for(int i=0;i<element.size()-1;i++){
System.out.println(element.get(i).getText());
}

How to render model property inside html word?

theres a model that contain several objects. I'd like to loop through it's collection and render it so it looks like this:
<div class = "tab-content" id = "home1">
</div>
<div class = "tab-content" id = "home2">
</div>
<div class = "tab-content" id = "home3">
</div>
I've tried many ways to solve this, but I couldnt find proper one. 'home' word is static html content and integer next to it is a c# statement taken from model.I know It's nothing complicated but It's just hard to find.
Eg. of what should it (+/-) look like inside the code
<div class = "tab-content" id = "home#p.id">
</div>
you can do:
<div class = "tab-content" id = "home#(p.id)">
#() is specifying that it is c# code.