23 votes

U7 Grid Data Type

This is an Umbraco 7 data type (property editor) for repeatable data ( data grid ).
Supported data types:

Textbox
Textarea
Rich text editor
Date picker / with time picker
Media picker
Multiple Media picker
Content picker
Multiple Content picker
Checkbox
Drop down
Numeric
Read only

This package will create a propery editor called "Content grid".
You will then need to create a new Data Type and select ‘Content grid’ for the Property editor field & edit your grid columns.

Note: This only works with Umbraco 7 or higher. Do not attempt to install on earlier versions.
** Version 1.2 is for umbraco 7.2.x **

Github : https://github.com/giladk/U7-Grid-Data-Type
You are more than welcome to contribute.

Razor example

<div>
@foreach (var dog in CurrentPage.dogs)
{
<div>
<p>Name - @dog.name </p>
@* Editor content - parse internal links *@
<p>@Html.Raw(umbraco.template.ParseInternalLinks(dog.description.ToString())) </p>
@* Media picker - single *@
@if (dog.image != "") {
IPublishedContent dogImage=Umbraco.TypedMedia(dog.image.ToString());
<img src="@dogImage.Url" />
}
@* Media picker multiple - split the id's *@
@if (dog.images != "") {
foreach (var item in dog.images.ToString().Split(','))
{
IPublishedContent dogImage = Umbraco.TypedMedia(item);
<img src="@dogImage.Url" />
}
}
@* Content picker multiple *@
@if (dog.brothers != ""){
foreach (var item in dog.brothers.ToString().Split(','))
{
// get link
var contentLink = Umbraco.NiceUrl(int.Parse(item));
// get node
dynamic pickerNode = new umbraco.MacroEngines.DynamicNode(item);
<a href="@contentLink">@pickerNode.Name</a>
}
}
@* Check box *@
@if (dog.trained == "True")
{
<p>This dog is traind.</p>
}
</div>
}
</div>