You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Feb 10, 2024. It is now read-only.
* Thanks to [Matt Brailsford](https://github.com/mattbrailsford) and [Lee Kelleher](https://github.com/leekelleher) for building this great package.
91
91
* Thanks to [Jeavon Leopold](https://github.com/Jeavon) for being a rockstar and adding AppVeyor & NuGet support.
92
92
* Thanks to [Dave Woestenborghs](https://github.com/dawoe) for helping solve showstopper issues.
93
-
* Thanks to [Søren Kottal](https://github.com/skttl)for help with localization.
93
+
* Thanks to [Arnold Visser](https://github.com/ArnoldV) and [Bjarne Fyrstenborg](https://github.com/bjarnef)for help with porting the package to Umbraco 8.
Copy file name to clipboardExpand all lines: docs/developers-guide.md
+35-20Lines changed: 35 additions & 20 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -16,7 +16,7 @@
16
16
17
17
### Introduction
18
18
19
-
**Doc Type Grid Editor** is an advanced grid editor for the new Umbraco grid, offering similar functionality as the macro grid editor but using the full power of the Doc Type editor and data types.
19
+
**Doc Type Grid Editor** is an advanced grid editor for the Umbraco grid, offering similar functionality as the macro grid editor but using the full power of the Doc Type editor and data types.
20
20
21
21
With the macro grid editor you are limited to only using the macro builder and thus the handful of parameter editors that are available. Of course you can create / config your own parameter editors, however this is cumbersome compared to how we can configure data types.
22
22
@@ -31,7 +31,7 @@ With the **Doc Type Grid Editor** then, we bridge that gap, allowing you to reus
31
31
Before you get started, there are a number of things you will need:
32
32
33
33
1. .NET 4.7.2+
34
-
2. Umbraco 8.0.2+
34
+
2. Umbraco 8.1.0+
35
35
3. The **Doc Type Grid Editor** package installed
36
36
37
37
---
@@ -68,8 +68,6 @@ You can also add your editors using a package.manifest file in a folder in the `
68
68
]
69
69
```
70
70
71
-

72
-
73
71
For the main part, the root properties shouldn’t need to be modified, however the only properties that MUST not be changed are the **view** and **render** properties.
74
72
75
73
| Member | Type | Description |
@@ -85,33 +83,40 @@ The **Doc Type Grid Editor** supports 3 config options, all of which are optiona
85
83
86
84
| Member | Type | Description |
87
85
|-----------------|----------|-------------|
88
-
| AllowedDocTypes | String[]| An array of doc type aliases of which should be allowed to be selected in the grid editor. Strings can be REGEX patterns to allow matching groups of doc types in a single entry. e.g. "Widget$" will match all doc types with an alias ending in "Widget". However if a single doc type is matched, (aka **Single Doc Type Mode**), then dropdown selection stage (in the DTGE panel) will be skipped. |
86
+
| AllowedDocTypes | String[]| An array of doc type aliases of which should be allowed to be selected in the grid editor. Strings can be REGEX patterns to allow matching groups of doc types in a single entry. e.g. "Widget$" will match all doc types with an alias ending in "Widget". However if a single doc type is matched, (aka **Single Doc Type Mode**), then doc type selection stage (in the DTGE panel) will be skipped. Note, your document type must be an Element type, in order to be usable in DTGE. |
89
87
| EnablePreview | Boolean | Enables rendering a preview of the grid cell in the grid editor. |
90
88
| LargeDialog | Boolean | Makes the editing dialog larger. Especially useful for grid editors with complex property editors. |
91
-
| ViewPath | String | Set's an alternative view path for where the **Doc Type Grid Editor** should look for views when rendering. Defaults to `~/Views/Partials/`|
89
+
| ViewPath | String | Sets an alternative view path for where the **Doc Type Grid Editor** should look for views when rendering. Defaults to `~/Views/Partials/`|
90
+
| PreviewViewPath | String | Sets an alternative view path for where the **Doc Type Grid Editor** should look for views when rendering previews in the backoffice |
92
91
| ShowDocTypeSelectAsGrid | Boolean | Makes the content type selection dialog render a grid, in stead of the default list with descriptions |
93
92
93
+
By default, a universal grid editor allowing all available element document types is added upon installation.
94
+
94
95
---
95
96
96
97
### Hooking Up The Doc Type Grid Editor
97
98
98
-
To hook up the **Doc Type Grid Editor**, within your grids prevalue, select the row configs you want to use the **Doc Type Grid Editor** in and for each cell config, check the **Doc Type** checkbox option to true. (NB: If you changed the name in the config, then select the item with the name you enter in the config).
99
+
To hook up the **Doc Type Grid Editor**, within your grids prevalue, select the row configs you want to use the **Doc Type Grid Editor** in and for each cell config, check the **Doc Type** checkbox option to true. If you changed the name in the config, then select the item with the name you enter in the config. And, if you add your own editors either by package.manifest, or by editing grid.editors.config.js, you will need to select those too.
99
100
100
101

101
102
102
-
With the Doc Type Grid Editor enabled, from within your grid editor, you should now have a new option in the **Insert Control** dialog.
103
+
With the Doc Type Grid Editor enabled, from within your grid editor, you should now have a new option in the **Choose type of content** dialog.
103
104
104
105

105
106
106
-
From there, simply click the **Doc Type** icon and chose the doc type you wish to render.
107
+
From there, simply click the **Doc Type** icon. If you have multiple document types matching the `AllowedDocTypes` setting in the selected grid editor (the default **Doc Type**, lets you pick between all available document types), you need to choose the document type you wish to render.
107
108
108
109

109
110
110
-
Then you should be presented with a form for all the fields in your doc type.
111
+
If you have any Content Templates available for the selected document type, you need to choose which template to use for the content.
112
+
113
+

114
+
115
+
Then you should be presented with a form for all the fields in your document type.
111
116
112
117

113
118
114
-
Fill in the fields and click save. You should then see the grid populated with a preview of your item.
119
+
Fill in the fields and click Submit. You should then see the grid populated with a preview of your item. If you have disabled previews using the `EnablePreview` setting, an icon will be shown to represent your content block.
115
120
116
121

117
122
@@ -121,33 +126,43 @@ Make sure save / save & publish the current page to persist your changes.
121
126
122
127
### Rendering a Doc Type Grid Editor
123
128
124
-
The **Doc Type Grid Editor** uses standard ASP.NET MVC partials as the rendering mechanism. By default it will look for partial files in `~/Views/Partials`with a name that matches the doc type alias. For example, if your doc type alias is `TestDocType`, the Doc Type Grid Editor will look for the partial file `~/Views/Partials/TestDocType.cshtml`.
129
+
The **Doc Type Grid Editor** uses standard ASP.NET MVC partials as the rendering mechanism. By default it will look for partial files in the `ViewPath` setting of your grid editor, or in the default partial view location (for exmaple `~/Views/Partials`). The rendering mechanism looks for a file with a name that matches the document type alias. For example, for the default setup, if your document type alias is `TestDocType`, the Doc Type Grid Editor will look for the partial file `~/Views/Partials/Grid/Editors/DocTypeGridEditor/TestDocType.cshtml`.
125
130
126
-
To access the properties of your completed doc type, simply have your partial view inherit the standard `UmbracoViewPage` class, and you’ll be able to access them via the standard `Model` view property as a native `IPublishedContent` instance.
131
+
To access the properties of your completed doc type, simply have your partial view inherit the standard `UmbracoViewPage` class, and you’ll be able to access them via the standard `Model` view property as a native `IPublishedElement` instance.
127
132
128
133
```
129
-
@inherits Umbraco.Web.Mvc.UmbracoViewPage
134
+
@inherits UmbracoViewPage<IPublishedElement>
130
135
<h3>@Model.Name</h3>
131
136
```
132
137
133
-
Because we treat your data as a standard `IPublishedContent` entity, that means you can use all the property value converters you are used to using, as well as the build in `@Umbraco.Field(...)` helper methods.
138
+
Because we treat your data as a standard `IPublishedElement` entity, that means you can use all the property value converters you are used to using.
Doc Type Grid Editor also supports ModelsBuilder, so you can simplify your views like this:
148
+
```
149
+
@inherits UmbracoViewPage<TestDocType>
150
+
<h3>@Model.Name</h3>
151
+
@Model.BodyText
152
+
<a href="@(Model.Link.Url)"> More</a>
140
153
```
141
154
142
155

143
156
144
157
145
158
#### Rendering Alternative Preview Content
146
159
147
-
If your front end view is rather complex, you may decide that you want to feed the back office preview an alternative, less complex view. To do this, within your Razor view/partial, check for a querystring parameter `dtgePreview` being set to "1" to detect being in preview mode to provide an alternative view.
160
+
If your front end view is rather complex, you may decide that you want to feed the back office preview an alternative, less complex view. To do this, you can use the `PreviewViewPath` setting on your grid editor, and place a view named after your document type there. **Doc Type Grid Editor** will use the preview view file, when rendering previews in the backoffice.
161
+
162
+
If you don't want to have a seperate preview view file, you can add preview logic within your Razor view/partial. Check for a querystring parameter `dtgePreview` being set to "1" to detect being in preview mode to provide an alternative view.
0 commit comments