Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[5.x] No GQL property for "Use multiple X fields" #1862

Closed
benfeather opened this issue May 2, 2024 · 2 comments
Closed

[5.x] No GQL property for "Use multiple X fields" #1862

benfeather opened this issue May 2, 2024 · 2 comments

Comments

@benfeather
Copy link

Describe the bug

I'm using Formie with the GraphQL API, but there's no field to determine whether a form control should use the nested fields. For example, here is the GQL fragment for the Name control:

fragment formFieldName on Field_Name {
  id
  uid
  label
  handle
  instructions
  required
  enabled
  type
  displayName
  typeName
  inputTypeName
  matchField
  placeholder
  defaultValue
  emailValue
  prePopulate
  errorMessage
  labelPosition
  instructionsPosition
  cssClasses
  containerAttributes {
    label
    value
  }
  inputAttributes {
    label
    value
  }
  includeInEmail
  enableConditions
  conditions
  enableContentEncryption
  visibility
  rows: nestedRows {
    fields: rowFields {
      id
      uid
      label
      handle
      instructions
      required
      enabled
      type
      displayName
      typeName
      inputTypeName
      matchField
      placeholder
      defaultValue
      emailValue
      prePopulate
      errorMessage
      labelPosition
      instructionsPosition
      cssClasses
      containerAttributes {
        label
        value
      }
      inputAttributes {
        label
        value
      }
      includeInEmail
      enableConditions
      conditions
      enableContentEncryption
      visibility
    }
  }
}

Which returns this JSON, as expected:

{
  "__typename": "Field_Name",
  "id": "122",
  "uid": "cdc32924-45fa-439b-b48b-c49319411674",
  "label": "Name multi",
  "handle": "nameMulti",
  "instructions": null,
  "required": false,
  "enabled": true,
  "type": "verbb\\formie\\fields\\Name",
  "displayName": "Name",
  "typeName": "Field_Name",
  "inputTypeName": "test_nameMulti_FormieNameInput",
  "matchField": null,
  "placeholder": null,
  "defaultValue": null,
  "emailValue": null,
  "prePopulate": null,
  "errorMessage": null,
  "labelPosition": null,
  "instructionsPosition": "verbb\\formie\\positions\\AboveInput",
  "cssClasses": null,
  "containerAttributes": [],
  "inputAttributes": null,
  "includeInEmail": true,
  "enableConditions": false,
  "conditions": null,
  "enableContentEncryption": false,
  "visibility": null,
  "rows": [
    {
      "__typename": "RowType",
      "fields": [
        {
          "__typename": "Field_NameFirst",
          "id": "119",
          "uid": "378ae141-32ff-4530-a070-8c38ded88724",
          "label": "First Name",
          "handle": "firstName",
          "instructions": null,
          "required": false,
          "enabled": true,
          "type": "verbb\\formie\\fields\\subfields\\NameFirst",
          "displayName": "NameFirst",
          "typeName": "Field_NameFirst",
          "inputTypeName": "String",
          "matchField": null,
          "placeholder": null,
          "defaultValue": null,
          "emailValue": null,
          "prePopulate": null,
          "errorMessage": null,
          "labelPosition": null,
          "instructionsPosition": null,
          "cssClasses": null,
          "containerAttributes": null,
          "inputAttributes": [
            {
              "__typename": "FieldAttribute",
              "label": "autocomplete",
              "value": "given-name"
            }
          ],
          "includeInEmail": true,
          "enableConditions": false,
          "conditions": null,
          "enableContentEncryption": false,
          "visibility": null
        },
        {
          "__typename": "Field_NameMiddle",
          "id": "120",
          "uid": "a3a8f554-cfec-4c75-85e1-57f913803ec5",
          "label": "Middle Name",
          "handle": "middleName",
          "instructions": null,
          "required": false,
          "enabled": true,
          "type": "verbb\\formie\\fields\\subfields\\NameMiddle",
          "displayName": "NameMiddle",
          "typeName": "Field_NameMiddle",
          "inputTypeName": "String",
          "matchField": null,
          "placeholder": null,
          "defaultValue": null,
          "emailValue": null,
          "prePopulate": null,
          "errorMessage": null,
          "labelPosition": null,
          "instructionsPosition": null,
          "cssClasses": null,
          "containerAttributes": null,
          "inputAttributes": [
            {
              "__typename": "FieldAttribute",
              "label": "autocomplete",
              "value": "additional-name"
            }
          ],
          "includeInEmail": true,
          "enableConditions": false,
          "conditions": null,
          "enableContentEncryption": false,
          "visibility": null
        },
        {
          "__typename": "Field_NameLast",
          "id": "121",
          "uid": "ae39f867-a670-4030-ac12-30fc3435948d",
          "label": "Last Name",
          "handle": "lastName",
          "instructions": null,
          "required": false,
          "enabled": true,
          "type": "verbb\\formie\\fields\\subfields\\NameLast",
          "displayName": "NameLast",
          "typeName": "Field_NameLast",
          "inputTypeName": "String",
          "matchField": null,
          "placeholder": null,
          "defaultValue": null,
          "emailValue": null,
          "prePopulate": null,
          "errorMessage": null,
          "labelPosition": null,
          "instructionsPosition": null,
          "cssClasses": null,
          "containerAttributes": null,
          "inputAttributes": [
            {
              "__typename": "FieldAttribute",
              "label": "autocomplete",
              "value": "family-name"
            }
          ],
          "includeInEmail": true,
          "enableConditions": false,
          "conditions": null,
          "enableContentEncryption": false,
          "visibility": null
        }
      ]
    }
  ]
}

However, if I disable the "Use multiple name fields" option, the response still returns the nested fields.

CleanShot 2024-05-03 at 10 11 15@2x

Ideally, when disabling the "Use multiple name fields" option, either:

  • The nestedRows field could return an empty array.
  • The multi-field toggle property could be available in the QGL query.

Then, on the front end, we can either check if the prop is enabled or if the nestedRows prop is empty and render the correct field layout.

I may be missing something, but I couldn't see this property in GraphiQL.

Steps to reproduce

N/A

Form settings

  • Multi-page form: No
  • Submission Method: Ajax/Vue
  • Client-side Validation: Yes
  • Custom Form Templates: Yes

Craft CMS version

5.1.0

Plugin version

dev-craft-5 as 3.0.0-beta.4

Multi-site?

Yes

Additional context

Using the dev-craft-5 version as it fixes the Stripe dep issue.

@engram-design
Copy link
Member

This is probably the only instance of a field being a condition sub-field. But looks like useMultipleFields is missing from the Name field interface. I think having that available is what we'll go for, compared to other options for simplicity.

Fixed for the next release. To get this early, run composer require verbb/formie:"dev-craft-5 as 3.0.0-beta.9".

@benfeather
Copy link
Author

Sounds good to me, Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants