How can i do this in razor:
when there is one item, i only want this item to be displayed. (item in fotoGallerij)
when there are more items, i want all of them (like the code bellow, working)
How can i make this if (i think) structure in razor (c# / umbraco)?
#inherits umbraco.MacroEngines.DynamicNodeContext
<ul class="image-gallery">
#foreach (var item in #Model.fotoGallerij)
{
<li>
<a class="gallery grouped" href="/ImageGen.ashx?height=500&constrain=true&crop=resize&image=#item.Image.umbracoFile" title="">
<img src="/ImageGen.ashx?width=71&height=73&crop=resize&image=#item.Image.umbracoFile" alt=""/></a>
</li>
}
</ul>
<script>
$("a.gallery").colorbox({rel:'grouped'});
</script>
Thanks for helping!
Razor is in effect C#, so anything you can do with C#, you can do with Razor. Something like this should work:
#inherits umbraco.MacroEngines.DynamicNodeContext
#if (Model.fotoGallerij.Count() == 1)
{
// Display only the one here...
}
else if (Model.fotoGallerij.Count() > 1)
{
// Loop through the list of items here...
}
Related
when i use ticker by foreache loop to list my title of news the ticker disappear
when i use only li tag static title the ticker works Normally
the error
when i use static li
Edit
partial View _breakingnews contains the foreach
<ul id="ticker01" class="news_sticker">
#foreach (var item in Model.Take(3))
{
<li><img src="images/news_thumbnail3.jpg" alt="">#item.Title </li>
}
</ul>
Home controller
public PartialViewResult _breakingnews()
{
var cat = db.breakingNews.ToList();
return PartialView(cat);
}
i call partial view in layout
#Html.Action("_breakingnews", "Home")
I have a selection generated from the children of the current page. Within that selection (let's call it Fruit) I have items and each item has a fruitType.
This code doesn't work:
#{
var selection = CurrentPage.Children("fruit").Where("Visible");
}
<ul>
#foreach(var item in selection){
#if(#item.fruitType == "Apple"){
<li>
#item.Name<br/>
#item.fruitName<br>
#item.fruitType<br>
#if (item.image != null && !(item.image is Umbraco.Core.Dynamics.DynamicNull))
{ var m = Umbraco.Media(item.image);
<img src="#m.Url" alt="Picture of #item.Name" />
}
</li>
}
}
</ul>
What I'm trying to do is to only list the items with a fruitType of "Apple". This value is selected from a "fruitType" dropdown list and I've tried using both the numeric and string values that Umbraco uses from Dropdown datatypes.
It all works perfectly if I remove the if conditional except that it displays all fruit types.
Any suggestions?
sigh Just one too many declarations..
Turns out neither the if nor the item references need the additional # declaration in front of it so the correct code looks like:
#{
var selection = CurrentPage.Children("fruit").Where("Visible");
}
<ul>
#foreach(var item in selection){
if(item.fruitType == "Apple"){
<li>
#item.Name<br/>
#item.fruitName<br>
#item.fruitType<br>
#if (item.image != null && !(item.image is Umbraco.Core.Dynamics.DynamicNull))
{ var m = Umbraco.Media(item.image);
<img src="#m.Url" alt="Picture of #item.Name" />
}
</li>
}
}
</ul>
I have the following code, and it displays the listed text and the pagination at the bottom all fine. But when I try to get the images from the child page into the list it errors for me. Any ideas why?
#inherits Umbraco.Web.Mvc.UmbracoTemplatePage
#{
Layout = "SiteLayout.cshtml";
}
<div role="main" id="main">
<div id="blogPageFeatures">
<!-- loop through all of the child pages (blog posts) and grab data to output as a summary -->
#{
var pageSize =3;
var page =1;int.TryParse(Request.QueryString["page"],out page);
var items =Model.Content.Children().Where(x => x.IsDocumentType("BlogArticle")).OrderByDescending(x => x.CreateDate);
var totalPages =(int)Math.Ceiling((double)items.Count()/(double)pageSize);
if(page > totalPages)
{
page = totalPages;
}
else if(page <1)
{
page =1;
}
}
#foreach(var item in items.Skip((page -1)* pageSize).Take(pageSize))
{
<a href="#item.Url">
<!-- The next image line is where it errors -->
<img src="#Umbraco.Media(item.Children.blogArticleImage).Url">
<h2>#item.Name</h2>
<p class="blogTileDate">#item.CreateDate.ToString("dd/MM/yy")</p>
</a>
}
<div class="clearfix"></div>
<!-- Pagination START -->
#if(totalPages >1)
{
<div class="pagination">
<ul>
#if(page >1)
{
<li>Prev</li>
}
#for(int p =1; p < totalPages +1; p++)
{
var active =(p == page)?" class=\"active\"":string.Empty;
<li#(Html.Raw(active))>
#p
</li>
}
#if(page <totalPages)
{
<li>Next</li>
}
</ul>
</div>
}
<!-- Pagination END -->
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
</div>
You are getting Model.Content.Children, which is a strongly typed collection of IPublishedContent objects. You are then calling item.Children.blogArticlImage, which is not going to work, as you're trying to get the a property on the children of the item, not a property of the item itself. You're also trying to use dynamic syntax, which won't work on the strongly typed objects. Try changing your image code to:
<img src="#Umbraco.TypedMedia(item.GetPropertyValue<int>("blogArticleImage")).Url">
That should do te trick, one thing to note is that if an item doesn't have an image set, or the image that has been selected has been deleted, it'll throw an error. A more robust approach would be something like this:
var imageSrc = "ADD DEFAULT IMAGE PATH HERE";
var media = Umbraco.TypedMedia(item.GetPropertyValue<int>("blogArticleImage"));
if (media != null && !string.IsNullOrEmpty(media.Url))
{
imageSrc = media.Url;
}
<mig src="#imageSrc">
I'm trying to create a razor menu in umbraco with a razor macro. I followed the umbraco tutorial about creating a razor menu:
http://umbraco.com/help-and-support/video-tutorials/umbraco-fundamentals/razor-recipes/navigation/TVPlayer
It works for my first three pages but then I want to add another one but the page doesn't show up in my menu. I have the following structure for my pages:
Start, calendar and Foto's do show up in my menu, but the news page doesn't. Is this structure correct or do I have to create a 'Home' page and place all my pages under that?
This is my razor macro code:
#inherits umbraco.MacroEngines.DynamicNodeContext
<nav>
<ul>
#{ var homeNode = Model.AncestorOrSelf("Home"); }
<li>#homeNode.Name</li>
#foreach (var page in homeNode.Children.Where("Visible"))
{
var isSelected = false;
if (Model.Id == page.Id || (Model.Parent != null && Model.Parent.Id == page.Id && Model.NodeTypeAlias != "Textpage"))
{
isSelected = true;
}
<li>
#page.Name
<!-- If the page has child nodes (2nd level) that are visible and docTypeAlias is Textpage (textpages) -->
#if (page.Children.Where("Visible").Count() > 0)
{
<ul>
#foreach (var childPage in page.Children.Where("Visible"))
{
<li>
#childPage.Name
</li>
}
</ul>
}
</li>
}
</ul>
</nav>
Ideally yes you need a page made with a doc type with the alias "Home" as you are defining you starting node/var by getting that page here,
var homeNode = Model.AncestorOrSelf("Home");
then after you are getting all the child pages of this homeNode so really all your structure should be
content
- Home
- start
- calender
- frontpage sliders
- fotos
- news
I have the following code block that nearly works. It completes the outer #foreach cycle and starts each sub #foreach cycle. It puts out the first image in each pair but then outputs
"} if(countItem==1) (" which can be read in the browser.
Any advice would be appreciated
Craig
Code:-
#inherits umbraco.MacroEngines.DynamicNodeContext
#{
int level = 2;
var subjects = #Model.AncestorOrSelf(level).Children.Where("nodeTypeAlias == \"SideGallerySectionHeading\"");
int countItem = 1;
if (subjects != null) {
<div class="highslide-gallery">
#foreach(var subjectName in subjects){
<h3>#subjectName.Name</h3>
foreach(dynamic image in subjectName.Children) {
if(countItem==1){<div class="picrowdiv">}
<div class="picdiv">
<a href="#image.Media("itemLarge","umbracoFile")" class="highslide" onclick="return hs.expand(this)">
<img src="#image.Media("itemThumbnail","umbracoFile")" width="100" height="100" alt="test"></a>
<div class="highslide-caption">
#image.bodyText
</div>
<p>#image.caption</p>
</div>
if(countItem==1){</div>}
countItem++;
if(countItem>2){countItem=1;}
}
}
</div>
}
}
You may try to rewrite the line
if(countItem==1){</div>}
into
#if(countItem==1){
</div>
}
Razor is quite picky about closing your html tags so you may have to refactor to make this work. I like ternary operators for stuff like this
try
#(countItem==1 ? "</div>")
#countItem++;
#(countItem>2 ? countItem=1)
you can also do else with a :
so
#(countItem==1 ? "</div>" : "")