Add proper page header names for field Elements

[pamtbaau]

See issue Elements field not saving data of element #552

The sample given for field Elements contains incorrect field names. Since sample started as a Page blueprint, I've updated all fields with a proper header prefix.

[mahagr]

BTW, elements also supports the dot notation, but yeah, the example was bad. :)

[pamtbaau]

@mahagr

elements also supports the dot notation

Would you mind elaborating on this?

[mahagr]

basically the previous example you changed, but with proper variables. Think of the list field -- that works everywhere. You can nest fields and get it nested by parent by prefixing the name with a dot.

[pamtbaau]

@mahagr, I asked because I did try several permutations, including the dot notation, but I can't get it to work. At least, it doesn't match my expectation...

I expect from element 'gelato' to get the following frontmatter:

elements-demo:
    type: gelato
    gelato:
        pistacchio: Pistacchio
        vanilla: Vanilla
        chocolate: Chocolate
        stracciatella: Stracciatella

When I use: header.elements-demo.gelato: as in the following snippet

header.elements-demo.type:
  type: elements
  label: 'Elements Demo'
  size: small
  default: gelato
  options:
    gelato: Gelato Flavors
    color: Color
    planets: Planets
  fields:
    gelato:
      type: element
      fields:
        header.elements-demo.gelato:    <-- field name
          type: array
          default:
            pistacchio: Pistacchio
            vanilla: Vanilla
            chocolate: Chocolate
            stracciatella: Stracciatella

The result is as expected.

When I use: .gelato: I get:

elements-demo:
    type: gelato
    gelato:
        gelato:
            pistacchio: Pistacchio
            vanilla: Vanilla
            chocolate: Chocolate
            stracciatella: Stracciatella

Would you mind providing a proper sample using the dot notation which I can add to the docs?

[mahagr]

Here's my working example from S3 plugin:

          .type:
            type: elements
            label: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE
            options:
              '': PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE_SELECT
              local: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE_LOCAL
              s3: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE_S3
            default: s3
            fields:
              s3:
                type: element
                fields:
                  .bucket:
                    type: text
                    label: PLUGIN_CLOUD_MEDIA.S3_BUCKET
                    placeholder: ex. my_bucket.us-east-1.amazonaws.com
                  .folder:
                    type: text
                    label: PLUGIN_CLOUD_MEDIA.S3_FOLDER

You can select either local or s3 and only s3 has extra options in it.

[pamtbaau]

Uhhh, something has changed.... I've installed a fresh download of Grav 1.7.32.

Andy already noted that much has changed in Admin and Forms. It wasn't working earlier after cloning Admin and Form dev branches separately though.

Anyway... Using full names instead of dot notation will now output an incorrect data structure.

Using full name notation your sample saves as:

myelements:
    type: s3
    bucket: 'my bucket'
    folder: 'my folder'

Using dot notation saves correctly as:

myelements:
    type: s3
    s3:
        bucket: 'my bucket'
        folder: 'my folder'

I'll update the docs. I don't have a better example though. So I only will fix a few things to make it work properly.

See PR: #984

[mahagr]

I just fixed some bugs and made improvements for the next version, here's the full version of the form:

form:
  validation: loose
  fields:
    enabled:
      type: toggle
      label: PLUGIN_ADMIN.PLUGIN_STATUS
      highlight: 1
      default: 0
      options:
        1: PLUGIN_ADMIN.ENABLED
        0: PLUGIN_ADMIN.DISABLED
      validate:
        type: bool

    default:
        type: text
        label: PLUGIN_CLOUD_MEDIA.DEFAULT_CLOUD_MEDIA
        description: PLUGIN_CLOUD_MEDIA.DEFAULT_CLOUD_MEDIA_DESC

    filesystems:
        type: list
        key: key
        label: PLUGIN_CLOUD_MEDIA.FILESYSTEMS
        fields:
          .key:
            type: key
            label: PLUGIN_CLOUD_MEDIA.FILESYSTEM_NAME
            validate:
              rule: key
          .title:
            type: text
            label: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TITLE
          .enabled:
            type: toggle
            label: PLUGIN_ADMIN.ENABLED
            highlight: 1
            default: 1
            options:
              1: PLUGIN_ADMIN.ENABLED
              0: PLUGIN_ADMIN.DISABLED
            validate:
              type: bool
          .type:
            type: elements
            label: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE
            options:
              '': PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE_SELECT
              local: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE_LOCAL
              s3: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE_S3
            default: s3
            fields:
              s3:
                type: element
                fields:
                  .bucket:
                    type: text
                    label: PLUGIN_CLOUD_MEDIA.S3_BUCKET
                    placeholder: ex. my_bucket.us-east-1.amazonaws.com
                  .folder:
                    type: text
                    label: PLUGIN_CLOUD_MEDIA.S3_FOLDER
                  .method:
                    type: elements
                    label: PLUGIN_CLOUD_MEDIA.FILESYSTEM_TYPE
                    default: profile
                    options:
                      profile: PLUGIN_CLOUD_MEDIA.S3_PROFILE
                      credentials: PLUGIN_CLOUD_MEDIA.S3_CREDENTIALS
                    fields:
                      .profile:
                        type: element
                        field:
                          type: text
                          label: PLUGIN_CLOUD_MEDIA.S3_PROFILE
                      .credentials:
                        type: element
                        fields:
                          .key:
                            type: text
                            label: PLUGIN_CLOUD_MEDIA.S3_KEY
                          .secret:
                            type: text
                            label: PLUGIN_CLOUD_MEDIA.S3_SECRET

Basically you can (from admin 1.10.33 and form 6.0.1) both nest the elements fields and have a single value (see .profile).

[mahagr]

@pamtbaau

I can verify that the full name notation does not work anymore. Can you create another issue for it?

Also, pull the latest changes in git to see my example in action. :)

Also, it would be great to have a full example with nesting and a single value (with a note that it requires at min those versions).

[pamtbaau]

@mahagr,

I can verify that the full name notation does not work anymore. Can you create another issue for it?

Done!

Also, pull the latest changes in git to see my example in action. :)

Not sure which repo you are referring to... In case it's Premium I have no access.

Also, it would be great to have a full example with nesting and a single value (with a note that it requires at min those versions).

I'll see if I can come up with a suitable example.