Five New Optimizely Certifications are Here! Validate your expertise and advance your career with our latest certification exams. Click here to find out more
AI OnAI Off
Five New Optimizely Certifications are Here! Validate your expertise and advance your career with our latest certification exams. Click here to find out more
I guess the easiest way to solve this is to create a viewmodel that has one property for div1 and one property for div2.
In page controller, you could have some like this:
var contentLoader = ServiceLocator.Current.GetInstance<IContentLoader>(); if (currentPage.MyContentArea?.FilteredItems != null) { var firstList = currentPage.MyContentArea .FilteredItems .Select(item => contentLoader.Get<IContent>(item.ContentLink)) .Take(12) .ToList(); var secondList = currentPage.MyContentArea .FilteredItems .Select(item => contentLoader.Get<IContent>(item.ContentLink)) .Skip(12) .ToList(); }
And then it's easy to render divs using the foreach loop.
Thanks a lot Dejan!
My controller looks like this:
var contentLoader = ServiceLocator.Current.GetInstance<IContentLoader>(); if (currentBlock.MyContentArea?.FilteredItems != null) { viewModel.FirstList = currentBlock.MyContentArea.FilteredItems.Select(item => contentLoader.Get<MySubBlock>(item.ContentLink)) .Take(12) .ToList(); viewModel.SecondList = currentBlock.MyContentArea.FilteredItems.Select(item => contentLoader.Get<MySubBlock>(item.ContentLink)) .Skip(12) .ToList();
And my viewmodel:
public List<MySubBlock> FirstList { get; set; } public List<MySubBlock> SecondList { get; set; }
Rendering views:
<div class="div1"> @if (Model.FirstList != null && Model.FirstList.Any()) { Html.RenderPartial("/Views/MySubBlock/Index.cshtml", Model.FirstList.ToArray()); } </div> <div class="div2" data-toggle-id="id"> @if (Model.SecondList != null && Model.SecondList.Any()) { Html.RenderPartial("/Views/MySubBlock/Index.cshtml", Model.SecondList.ToArray()); } </div>
How can I place the first and up to the 12th item from a ContentArea in one div while making sure that if more than 12 items exist any item above the 12th must be placed in another div?