Press Ctrl / CMD + C to copy this to your clipboard.
This post will be reported to the moderators as potential spam to be looked at
Hi Guys,
Can you anyone guide me how to render a grid layout in a view?
I just had the following:
@Model.Content.GetGridHtml("grid")
But nothing is shown on page and I have just set some rows , etc on a page.
any help pleasE?
Kind Regards
Yep that looks right to me, the GetGridHtml method also takes an extra parameter where you can specify the partial view that should render it.
@Model.Content.GetGridHtml("grid", "Fanoe")
"grid" is the propertyAlias
And then in Views/Partials/Grid/Editors (in 7.4 it's moved from App_Plugins) you have a file called Fanoe.cshtml with the following:
@inherits UmbracoViewPage<dynamic> @using Umbraco.Web.Templates @using Newtonsoft.Json.Linq <h1>Fanoe</h1> @if (Model != null && Model.sections != null) { var oneColumn = ((System.Collections.ICollection)Model.sections).Count == 1; <div class="umb-grid"> @if (oneColumn) { foreach (var section in Model.sections) { <div class="grid-section"> @foreach (var row in section.rows) { @renderRow(row, true); } </div> } } else { <div class="container"> <div class="row clearfix"> @foreach (var s in Model.sections) { <div class="grid-section"> <div class="col-md-@s.grid column"> @foreach (var row in s.rows) { @renderRow(row, false); } </div> </div> } </div> </div> } </div> } @helper renderRow(dynamic row, bool singleColumn) { <div @RenderElementAttributes(row)> @Umbraco.If(singleColumn, "<div class='container'>") <div class="row clearfix"> @foreach ( var area in row.areas ) { <div class="col-md-@area.grid column"> <div @RenderElementAttributes(area)> @foreach (var control in area.controls) { if (control !=null && control.editor != null && control.editor.view != null ) { <text>@Html.Partial("grid/editors/base", (object)control)</text> } } </div> </div>} </div> @Umbraco.If(singleColumn, "</div>") </div> } @functions { public static MvcHtmlString RenderElementAttributes(dynamic contentItem) { var attrs = new List<string>(); JObject cfg = contentItem.config; if(cfg != null) { foreach (JProperty property in cfg.Properties()) { attrs.Add(property.Name + "='" + property.Value.ToString() + "'"); } } JObject style = contentItem.styles; if (style != null) { var cssVals = new List<string>(); foreach (JProperty property in style.Properties()) { cssVals.Add(property.Name + ":" + property.Value.ToString() + ";"); } if (cssVals.Any()) { attrs.Add("style='" + string.Join(" ", cssVals) + "'"); } } return new MvcHtmlString(string.Join(" ", attrs)); } }
Note that it looks like in 7.4 GetGridHtml(string, string) is deprecated and it is recommended to use GetGridHtml(HtmlHelper, string)
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.
Continue discussion
Umbraco Grid LAyout Rendering
Hi Guys,
Can you anyone guide me how to render a grid layout in a view?
I just had the following:
But nothing is shown on page and I have just set some rows , etc on a page.
any help pleasE?
Kind Regards
Yep that looks right to me, the GetGridHtml method also takes an extra parameter where you can specify the partial view that should render it.
"grid" is the propertyAlias
And then in Views/Partials/Grid/Editors (in 7.4 it's moved from App_Plugins) you have a file called Fanoe.cshtml with the following:
Note that it looks like in 7.4 GetGridHtml(string, string) is deprecated and it is recommended to use GetGridHtml(HtmlHelper, string)
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.