Tagged: , ,

Viewing 5 reply threads
  • Author
    Posts
    • December 2, 2014 at 5:58 pm #2914
      Jason
      Keymaster

      Greetings!

      I was trying to nest some groups within a settings page, not necessarily for organizational purposes, but to provide a visual layout of the settings. Unfortunately, this doesn’t seem to work as the fields don’t fit within the groups.

      <?php
/*
 * Setting: custom-theme-options
 */

piklist('field', array(
  'type'    => 'group',
  'field'   => 'visit-menu',
  'label'   => 'Visit Menu',
  'fields'  => array(
    array(
      'type'      => 'group',
      'field'     => 'visit',
      'label'     => 'Visit Section',
      'fields'    => array(
        array(
          'type'      => 'textarea',
          'field'     => 'visit-text',
          'label'     => 'Visit Description',
          'columns'   => 10,
          'attributes'=> array(
            'rows'      => 4
          )
        ),
        array(
          'type'      => 'text',
          'field'     => 'visit-link-text',
          'label'     => 'Visit Link Text',
          'columns'   => 5,
          'sanitize'  => array(
            array(
              'type'      => 'text_field'
            )
          )
        ),
        array(
          'type'    => 'text',
          'field'   => 'visit-link-url',
          'label'   => 'Visit Link URL',
          'columns' => 5,
          'validate'=> array(
            array(
              'type'    => 'url'
            )
          )
        ),
      )
    ),
    array(
      'type'      => 'group',
      'field'     => 'internet',
      'label'     => 'Internet Campus',
      'fields'    => array(
        array(
          'type'      => 'textarea',
          'field'     => 'internet-text',
          'label'     => 'Internet Description',
          'columns'   => 10
        ),
        array(
          'type'      => 'text',
          'field'     => 'internet-phone',
          'label'     => 'Internet Phone Number',
          'columns'   => 4,
          'sanitize'  => array(
            array(
              'type'      => 'text_field'
            )
          )
        )
      )
    )
  )
));

      I’m not sure if there’s intention to support this, but I figured I’d bring it up.

    • December 2, 2014 at 8:20 pm #2915
      Steve
      Keymaster

      The Piklist grid is 12 columns. All fields per row need to add up to 12. It looks like you have 20 columns.

    • December 2, 2014 at 9:54 pm #2917
      Jason
      Keymaster

      There’s 3 fields: 10 + (5 + 5)

      That would normally just mean the first field is on it’s own row and the last two fields are on a row. If I settle everything down to a single group (remove the nesting) then the columns work just fine.

      Thoughts?

    • December 2, 2014 at 11:32 pm #2918
      Steve
      Keymaster

      @jason– I’m not 100% sure how you want the layout, but I removed one the groups and it looks pretty good. Let me know what you think:

      piklist('field', array(
  'type'    => 'group',
  'field'   => 'visit-menu',
  'label'   => 'Visit Menu',
  'fields'  => array(
        array(
          'type'      => 'textarea',
          'field'     => 'visit-text',
          'label'     => 'Visit Description',
          'columns'   => 12,
          'attributes'=> array(
            'rows'      => 4
          )
        ),
        array(
          'type'      => 'text',
          'field'     => 'visit-link-text',
          'label'     => 'Visit Link Text',
          'columns'   => 6,
          'sanitize'  => array(
            array(
              'type'      => 'text_field'
            )
          )
        ),
        array(
          'type'    => 'text',
          'field'   => 'visit-link-url',
          'label'   => 'Visit Link URL',
          'columns' => 6,
          'validate'=> array(
            array(
              'type'    => 'url'
            )
          )
    ),
    array(
      'type'      => 'group',
      'field'     => 'internet',
      'label'     => 'Internet Campus',
      'fields'    => array(
        array(
          'type'      => 'textarea',
          'field'     => 'internet-text',
          'label'     => 'Internet Description',
          'columns'   => 12
        ),
        array(
          'type'      => 'text',
          'field'     => 'internet-phone',
          'label'     => 'Internet Phone Number',
          'columns'   => 4,
          'sanitize'  => array(
            array(
              'type'      => 'text_field'
            )
          )
        )
      )
    )
  )
));
    • December 3, 2014 at 11:00 am #2921
      Jason
      Keymaster

      Hmm.. I see. Clearly it’s more important that the columns add up to 12 per row than I realized. I assumed it would just cleanly float beyond that point. It usually does, but this isn’t the first time I’ve ran into issues.

      It’s not quite what I had in mind, however, but I’m not really sure that’s up to Piklist to solve. I was imagining that each group would indent as it nested. As it is, I could just apply my own styles to provide padding above the group label to help distinguish sections better.

      Thanks, Steve!

    • December 3, 2014 at 11:13 am #2923
      Steve
      Keymaster

      @jason– You can always use an empty HTML field to fill up space in the 12 column grid.

  • Author
    Posts
Viewing 5 reply threads
  • The topic ‘Nested Groups in Settings’ is closed to new replies.