Passing values from a Drupal Paragraphs item to a custom module’s form via Bamboo Twig

Phil Wolstenholme
2 min readNov 19, 2018
Photo by Jonathan Meyer on Unsplash

At work I’m one sprint into a new project where we have decided to use Pattern Lab and component-based design for the first time. It’s going really well, and I’m learning a lot. As a frontend developer it’s great to finally have control of the markup coming from Drupal, and to be thinking in terms of components that Drupal passes data to, rather than thinking of how to use CSS and JS to massage Drupal’s default markup into looking like the designs.

With this project, I’m focusing on using as little custom code as possible, and trying to use Core and Contrib wherever possible. #lowcode #nocode

Recently I needed a way to show a search form inside a Paragraph, and to pass in some options from the Paragraph to the form. I needed to pass a string to use as a placeholder for the search input, and also a flag to toggle the form’s action between searching the whole site and searching a subset of it. Here’s how I did it:

I wanted an easy way to create a search form without doing it from scratch, so I extended the SearchBlockForm provided by Core:

Notice that we’ve added a third parameter to the buildForm function called $parameters . We can use that to pass some data between our Paragraph item and the form.

Because we overrode the getFormId method and gave our new form an ID we will be able to create a Twig template suggestion for this specific form. Without that ID, we’d only have had template suggestions for the Core search form, which we might not want to style. We can now create a template for our ‘search banner’ Paragraph:

I am using Twig Field Value to expose a title and summary field to my search bar organism, as well as to my SearchBannerForm. More importantly, the form is being rendered via Bamboo Twig, which lets us pass an object of data from the Paragraph item template to the buildForm function that we created earlier. It’s a really elegant way to pass data around without things getting too complicated, and without having to write too much custom module code.

Bamboo Twig can do a lot more too, and is a solid replacement for modules like Twig Tweak.

--

--

Phil Wolstenholme

I’m an accomplished developer with a wide range of skills, knowledge, and experience, particularly focussed on accessibility and frontend web performance.