Problem/Motivation

Drupal Core provides Vertical Tabs as Render Element: https://api.drupal.org/api/drupal/core%21lib%21Drupal%21Core%21Render%21...

So you would expect that if there are vertical tabs, there should also be horizontal tabs.
But that's not the case!

See https://api.drupal.org/api/drupal/namespace/Drupal%21Core%21Render%21Ele...

Steps to reproduce

Try switching from
'#type' => 'vertical_tabs'
to
'#type' => 'horizontal_tabs'
and wonder horizontal_tabs isn't existing

Proposed resolution

Move the horizontal tabs implementation (and maybe also other field group types) from Field Group module into core and remove it from field_group. Also deprecate Horizontal Tabs module

Remaining tasks

User interface changes

API changes

Data model changes

Release notes snippet

Take advantage of vertical tab, add horizontal tabs into core.

CommentFileSizeAuthor
#8 Screen Shot 2017-09-03 at 6.30.55 PM.png70.01 KBjrockowitz
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

bismigalis’s picture

bismigalis CreditAttribution: bismigalis commented

double

Version: 8.0.x-dev » 8.1.x-dev

Drupal 8.0.6 was released on April 6 and is the final bugfix release for the Drupal 8.0.x series. Drupal 8.0.x will not receive any further development aside from security fixes. Drupal 8.1.0-rc1 is now available and sites should prepare to update to 8.1.0.

Bug reports should be targeted against the 8.1.x-dev branch from now on, and new development or disruptive changes should be targeted against the 8.2.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.1.x-dev » 8.2.x-dev

Drupal 8.1.9 was released on September 7 and is the final bugfix release for the Drupal 8.1.x series. Drupal 8.1.x will not receive any further development aside from security fixes. Drupal 8.2.0-rc1 is now available and sites should prepare to upgrade to 8.2.0.

Bug reports should be targeted against the 8.2.x-dev branch from now on, and new development or disruptive changes should be targeted against the 8.3.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.2.x-dev » 8.3.x-dev

Drupal 8.2.6 was released on February 1, 2017 and is the final full bugfix release for the Drupal 8.2.x series. Drupal 8.2.x will not receive any further development aside from critical and security fixes. Sites should prepare to update to 8.3.0 on April 5, 2017. (Drupal 8.3.0-alpha1 is available for testing.)

Bug reports should be targeted against the 8.3.x-dev branch from now on, and new development or disruptive changes should be targeted against the 8.4.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.3.x-dev » 8.4.x-dev

Drupal 8.3.6 was released on August 2, 2017 and is the final full bugfix release for the Drupal 8.3.x series. Drupal 8.3.x will not receive any further development aside from critical and security fixes. Sites should prepare to update to 8.4.0 on October 4, 2017. (Drupal 8.4.0-alpha1 is available for testing.)

Bug reports should be targeted against the 8.4.x-dev branch from now on, and new development or disruptive changes should be targeted against the 8.5.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

agoradesign’s picture

agoradesign CreditAttribution: agoradesign commented
Issue summary: View changes

I just needed the same thing.

I failed in integrating the horizontal tabs from field_group module programmatically and ended up in build my own horizontal_tabs form element based on the core's vertical_tabs. You can find this on Github: https://github.com/agoradesign/horizontal_tabs

I've explained in the README file of the module, why it currently is only hosted on Github and not on Drupal. First I want to see that there's demand for that and that the chances are low that this functionality gets merged into Core or field_group soon.

tacituseu’s picture

tacituseu CreditAttribution: tacituseu commented
Version: 8.4.x-dev » 8.5.x-dev
jrockowitz’s picture

jrockowitz CreditAttribution: jrockowitz as a volunteer and at The Big Blue House commented
Issue summary: View changes
FileSize
Screen Shot 2017-09-03 at 6.30.55 PM.png70.01 KB

I also just added support for horizontal tabs using jQueryUI to the Webform module's UX (for D8)

Anybody’s picture

Anybody
Primary language German
Location Porta Westfalica
CreditAttribution: Anybody commented

Horizontal Tabs would make a lot of sense in D8 core while Vertical tabs already exist. +1

droplet’s picture

droplet CreditAttribution: droplet commented
Project: Drupal core » Drupal core ideas
Version: 8.5.x-dev »
Component: forms system » Idea

Let's see if we could get it approve before implementation. I believe we only need few CSS additions. (Something like a class to toggle the states)

Anybody’s picture

Anybody
Primary language German
Location Porta Westfalica
CreditAttribution: Anybody commented

Ok sounds good. Everything else should be part of horizontal_tabs module as described above.

jhonatasfender’s picture

jhonatasfender CreditAttribution: jhonatasfender as a volunteer commented

https://github.com/agoradesign/horizontal_tabs/issues/1

I ran the composer require to test, when I enabled the module it presented this error.

[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP Fatal error:  Cannot redeclare template_preprocess_horizontal_tabs() (previously declared in C:\project\bancorbras_memorias\web\modules\contrib\horizontal_tabs\horizontal_tabs.module:24) in C:\project\bancorbras_memorias\web\modules\contrib\field_group\templates\theme.inc on line 22
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP Stack trace:
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   1. {main}() C:\project\bancorbras_memorias\web\index.php:0
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   2. Drupal\Core\DrupalKernel->handle() C:\project\bancorbras_memorias\web\index.php:19
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   3. Stack\StackedHttpKernel->handle() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\DrupalKernel.php:693
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   4. Drupal\Core\StackMiddleware\NegotiationMiddleware->handle() C:\project\bancorbras_memorias\vendor\stack\builder\src\Stack\StackedHttpKernel.php:23
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   5. Drupal\Core\StackMiddleware\ReverseProxyMiddleware->handle() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\StackMiddleware\NegotiationMiddleware.php:52
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   6. Drupal\page_cache\StackMiddleware\PageCache->handle() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\StackMiddleware\ReverseProxyMiddleware.php:47
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   7. Drupal\page_cache\StackMiddleware\PageCache->pass() C:\project\bancorbras_memorias\web\core\modules\page_cache\src\StackMiddleware\PageCache.php:78
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   8. Drupal\Core\StackMiddleware\KernelPreHandle->handle() C:\project\bancorbras_memorias\web\core\modules\page_cache\src\StackMiddleware\PageCache.php:99
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP   9. Drupal\Core\StackMiddleware\Session->handle() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\StackMiddleware\KernelPreHandle.php:47
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  10. Symfony\Component\HttpKernel\HttpKernel->handle() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\StackMiddleware\Session.php:57
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  11. Symfony\Component\HttpKernel\HttpKernel->handleRaw() C:\project\bancorbras_memorias\vendor\symfony\http-kernel\HttpKernel.php:68
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  12. Drupal\Component\EventDispatcher\ContainerAwareEventDispatcher->dispatch() C:\project\bancorbras_memorias\vendor\symfony\http-kernel\HttpKernel.php:156
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  13. call_user_func:{C:\project\bancorbras_memorias\web\core\lib\Drupal\Component\EventDispatcher\ContainerAwareEventDispatcher.php:111}() C:\project\bancorbras_memorias\web\core\lib\Drupal\Component\EventDispatcher\ContainerAwareEventDispatcher.php:111
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  14. Drupal\Core\EventSubscriber\MainContentViewSubscriber->onViewRenderArray() C:\project\bancorbras_memorias\web\core\lib\Drupal\Component\EventDispatcher\ContainerAwareEventDispatcher.php:111
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  15. Drupal\Core\Render\MainContent\HtmlRenderer->renderResponse() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\EventSubscriber\MainContentViewSubscriber.php:90
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  16. Drupal\Core\Render\Renderer->executeInRenderContext() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Render\MainContent\HtmlRenderer.php:148
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  17. Drupal\Core\Render\MainContent\HtmlRenderer->Drupal\Core\Render\MainContent\{closure}() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Render\Renderer.php:582
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  18. Drupal\Core\Render\Renderer->render() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Render\MainContent\HtmlRenderer.php:147
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  19. Drupal\Core\Render\Renderer->doRender() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Render\Renderer.php:195
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  20. Drupal\Core\Theme\ThemeManager->render() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Render\Renderer.php:437
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  21. Drupal\Core\Theme\Registry->getRuntime() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Theme\ThemeManager.php:142
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  22. Drupal\Core\Utility\ThemeRegistry->__construct() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Theme\Registry.php:253
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  23. Drupal\Core\Utility\ThemeRegistry->initializeRegistry() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Utility\ThemeRegistry.php:67
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  24. Drupal\Core\Theme\Registry->get() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Utility\ThemeRegistry.php:86
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  25. Drupal\Core\Theme\Registry->build() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Theme\Registry.php:233
[12-Mar-2019 11:30:38 America/Sao_Paulo] PHP  26. Drupal\Core\Theme\Registry->processExtension() C:\project\bancorbras_memorias\web\core\lib\Drupal\Core\Theme\Registry.php:334

to solve the problem I changed the code to:

function horizontal_tabs_preprocess_horizontal_tabs(&$variables) {
  $element = $variables['element'];
  $variables['children'] = (!empty($element['#children'])) ? $element['#children'] : '';
}

I would like to know if I can contribute to this change, is it valid?

agoradesign’s picture

agoradesign CreditAttribution: agoradesign commented

Problem is that field_group and horizontal_tabs conflict with each other. They both declare the same theme hook. see #2988689: Conflict with module field_group

jhonatasfender’s picture

jhonatasfender CreditAttribution: jhonatasfender as a volunteer commented

@agoradesign Do you think it's important to post this to help close people?

Anybody’s picture

Anybody
Primary language German
Location Porta Westfalica
CreditAttribution: Anybody at DROWL.de commented
Title: add horizontal tabs supports to FAPI » Add horizontal tabs supports to FAPI
Issue summary: View changes
Related issues: +#3362594: Deprecate in favor of Field Group module

FYI: horizontal_tabs are not only part of horizontal_tabs module, but also field_group module!
I created an issue in horizontal_tabs to deprecate it and join efforts on field_group module: #3362594: Deprecate in favor of Field Group module

Updating the issue summary.

Anybody’s picture

Anybody
Primary language German
Location Porta Westfalica
CreditAttribution: Anybody at DROWL.de commented
Issue summary: View changes