So this works perfectly if the user selects "fluid" radio button and the outputted div is:
<div class="containerfluid">
But I want the modifier to actually show by default so my default class is:
<div class="container">
At the moment it just returns a div with no class applied to it - which makes sense - but is there no option for a default value or even showing the modifier by default?
It's a little late, but perhaps this is useful for you! ;-)
I have updated the default RenderElementAttributes, so that you can pass in a css class, and it handles rendering out cssClasses that are set on the grid elements nicely too.
@functions {
public static MvcHtmlString RenderElementAttributes(dynamic contentItem, string cssClass)
{
var attrs = new List<string>();
var classes = new List<string>(); // place to store our classes
JObject cfg = contentItem.config;
if (cfg != null)
foreach (JProperty property in cfg.Properties())
{
// if the setting is a class, add it to our classes list
if (property.Name == "class")
{
var propertyValue = HttpUtility.HtmlAttributeEncode(property.Value.ToString());
classes.Add(propertyValue);
}
else
{
var propertyValue = HttpUtility.HtmlAttributeEncode(property.Value.ToString());
attrs.Add(property.Name + "=\"" + propertyValue + "\"");
}
}
JObject style = contentItem.styles;
if (style != null)
{
var cssVals = new List<string>();
foreach (JProperty property in style.Properties())
{
var propertyValue = property.Value.ToString();
if (string.IsNullOrWhiteSpace(propertyValue) == false)
{
cssVals.Add(property.Name + ":" + propertyValue + ";");
}
}
if (cssVals.Any())
attrs.Add("style=\"" + HttpUtility.HtmlAttributeEncode(string.Join(" ", cssVals)) + "\"");
}
// inject the class that was passed into the helper
if (cssClass != String.Empty)
classes.Add(cssClass);
// inject the class attribute
if (classes.Any())
attrs.Add("class=\"" + HttpUtility.HtmlAttributeEncode(string.Join(" ", classes)) + "\"");
return new MvcHtmlString(string.Join(" ", attrs));
}
}
In my site I'm then calling this like:
@helper renderRow(dynamic row)
{
foreach (var area in row.areas)
{
<div @RenderElementAttributes(area, "c" + area.grid.ToString())>
<div>
@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>
}
}
Modifier for RenderElementAttributes(row) using the Grid
Hello everyone,
Tearing my hair out trying to work this out, I am using the default "CSS style" in the Grid settings and I currently have this setup:
So this works perfectly if the user selects "fluid" radio button and the outputted div is:
But I want the modifier to actually show by default so my default class is:
At the moment it just returns a div with no class applied to it - which makes sense - but is there no option for a default value or even showing the modifier by default?
Thanks, Garry.
It's a little late, but perhaps this is useful for you! ;-)
I have updated the default
RenderElementAttributes
, so that you can pass in a css class, and it handles rendering out cssClasses that are set on the grid elements nicely too.In my site I'm then calling this like:
The important bit being:
This results in:
For reference the grid config JSON looks like:
is working on a reply...