configuring treepicker editor in grid settings

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Shane Marsden 13 posts 76 karma points

Feb 12, 2015 @ 17:57
1

Configuring treepicker editor in Grid settings

Using Umbraco 7
It says here: https://our.umbraco.org/documentation/using-umbraco/backoffice-overview/property-editors/built-in-property-editors-v7/grid-layout#Configuringacustomsettingorstyle that you can specify treepicker as a valid value for the "view" parameter, however it doesn't specify how to configure it.

When defining a data type generally, you can specify the start node and filter options, however I can't see how to do that for the Grid.

I'm trying to do this because there doesn't seem to be a way of specifying separate keys and values for radio buttons, but I'd definitely go that way that is an option.

I've tried a few things, which I've pasted below, but if somebody could tell me the correct way to configure that I'd be grateful:

Attempt #1:
```
[
  {
    "label": "Row style",
    "description": "Set a row style",
    "key": "class-row",
    "view": "treepicker",
    "startNode": {
      "type": "content",
      "id": 1303
    },
    "applyTo": "row"
  }
]
```
Attempt #2:
```
[
  {
    "label": "Row style",
    "description": "Set a row style",
    "key": "class-row",
    "view": "treepicker",
    "config": {
      "startNode": {
        "type": "content",
        "id": 1303
      }
    },
    "applyTo": "row"
  }
]
```
Copy Link
Shane Marsden 13 posts 76 karma points

Feb 16, 2015 @ 12:15

0

Anyone?

Copy Link

Shane Marsden 13 posts 76 karma points

Feb 17, 2015 @ 21:55

Hi all,

So I solved this one for me. It turns out that the treepicker isn't configurable, so I went with the other option I was looking for but couldn't find: allowing separate keys and values for radio buttons.

To do this, simply specify the prevalues in the grid configuration as objects in an array rather than strings, e.g.:

[
  {
    "label": "Row style",
    "description": "Set a row style",
    "key": "class-row",
    "view": "/label-value-prevalueeditor-radiobuttonlist.html",
    "prevalues": [
      {
        "label": "label1",
        "value": "value1",
        "description": "description1"
      },
      {
        "label": "label2",
        "value": "value2",
        "description": "description2"
      },
      {
        "label": "label3",
        "value": "value3",
        "description": "description3"
      }
    ]
  }
]

I then found that the radiobuttonlist option uses the radiobuttonlist.html file in the source, which I modified to use the properties of the object in each array element. I created a new file, referenced in the snippet above, that contained the following code:

<ul class="unstyled">
    <li ng-repeat="preval in model.prevalues">
        <label class="checkbox" title="{{preval.description}}">
            <input type="radio" ng-model="model.value" value="{{preval.value}}" /> {{preval.label}}
        </label>
    </li>
</ul>

Hope this helps someone out there!

Copy Link

is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?