1

I would like to get rid of the ajax "add more items" button at the bottom of a multiple elements form item.

The D8 webform I'm building has a custom composite element with multiple values allowed. The table form display has nice + and – buttons in each row. The "Add x more items" element below the table is not needed.

In the advanced tab, under "Multiple settings", there is only an option to hide the +/– buttons, not the "Add x more items" element.

Additional information:

Webform module version: 8.x-5.0-rc7
YAML Source (excerpt):

   fieldset_teilnehmer:
    '#type': fieldset
    '#title': Teilnehmer
    teilnehmer:
      '#type': custom_composite
      '#title': Teilnehmer
      '#required': true
      '#required_error': 'Bitte tragen Sie die Teilnehmer ein.'
      '#multiple__label': Teilnehmer
      '#multiple__labels': Teilnehmer
      '#multiple__min_items': '5'
      '#multiple__empty_items': '5'
      '#multiple__sorting': false
      '#element':
        teilnehmer_name:
          '#type': textfield
          '#title': Name
        teilnehmer_alter:
          '#type': select
          '#options':
            18: ≥18
            17: 17
            16: 16
            15: 15
            14: 14
            13: 13
            12: 12
            11: 11
            10: 10
            9: 9
            8: 8
            7: 7
            6: 6
            5: 5
            4: 4
            3: 3
            2: 2
            1: 1
            0: 0
          '#title': Alter
  • 1
    You can always hide it with css !! – GiorgosK Mar 27 '18 at 10:18
  • Yes, CSS is something I will consider – looking at the code, I will have to make both #edit-fieldname-add-submit and .form-item-fieldname-add-more-items invisible. – Hendrik Mar 27 '18 at 11:25
4

If you set the "Minimum amount of items" and "Number of empty items" to the same number the add more won't appear.

Here is a screenshot

enter image description here

Here is the YAML source for basic multiple text field

textfield:
  '#type': textfield
  '#title': textfield
  '#multiple': 5
  '#multiple__min_items': '5'
  '#multiple__empty_items': '5'

Here is the YAML source for multiple custom composite

custom_composite:
  '#type': custom_composite
  '#title': custom_composite
  '#multiple': 5
  '#multiple__min_items': '5'
  '#multiple__empty_items': '5'
  '#multiple__sorting': false
  '#multiple__operations': false
  '#element':
    textfield:
      '#type': textfield
      '#title': textfield
    select:
      '#type': select
      '#options': days
      '#title': select
  • Unfortunately, this does not work for. I've tried your example, with various equal values for min_items and empty_items. – Hendrik Mar 27 '18 at 11:17
  • What version of the Webform module are you using? Please post an example of the generated YAML. – jrockowitz Mar 27 '18 at 13:10
  • Sure. See edits above. – Hendrik Mar 27 '18 at 13:42
  • 1
    The key trick is '#multiple', '#multiple__min_items', and '#multiple__empty_items' all have to be same value. – jrockowitz Mar 27 '18 at 16:19
  • 1
    Okay, that is not currently supported. You should use CSS. On mobile, the 'Add more' is needed because the add/remove buttons are hidden. – jrockowitz Mar 28 '18 at 10:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.