0

I have a content type with a paragraph that has two fields, each field inside its own tab controlled by the form display like so:

showing tabbed form display

Here is what the set of tabbed fields looks like when editing a piece of content of the content type:

single tab display on content edit

multi tab display on content edit

The paragraph also has a bool field called field_active_callout_tab with two values: 'Single' and 'Multi', same as the tabs.

If the 'Single' tab is clicked, I want the bool to be checked. If the 'Multi' tab is selected, I want the bool to be unchecked.

I tried to use the Conditional Fields module, but it will not allow control by tab label. How can I establish this dependency between the tab and the bool?

1 Answer 1

1

You can do it with jQuery, something like this should do it:

$('.single-class').click(function () {
    $('.bool-class').prop('checked', true);
});
$('.multi-class').click(function () {
  $('.bool-class').prop('checked', false);
});
4
  • thanks for that! Can you please explain where this jquery should go? Do I need to put it in a js file and then reference it from the paragraph template, or can I add it directly into the paragraph twig template? Further, are these classes assumed to be added on the fields / tab labels directly in manage form display?
    – lane
    Apr 19, 2018 at 18:06
  • You must define a library in your module, it is explained how to do it here drupal.org/docs/8/creating-custom-modules/…. The class names you find by inspecting the element in the browser, for further information on how to do that look here lifewire.com/get-inspect-element-tool-for-browser-756549
    – user72672
    Apr 19, 2018 at 20:34
  • I'm not using a module to control the banner, just a twig template. Do you think I should add a custom JavaScript file to the theme and reference it from within the twig file?
    – lane
    Apr 20, 2018 at 0:00
  • Yes you shall add it to the theme, it is actually the same procedure look here, drupal.org/docs/8/theming-drupal-8/…
    – user72672
    Apr 20, 2018 at 2:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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