...

/

Adding Our First Controller

Adding Our First Controller

Add a controller to the application in this lesson.

How controllers work

The bulk of your Stimulus code will go through a controller, which is similar to your Rails controller in that it’s where the responses to events are stored, but there’s much less structure and expectations around a Stimulus controller than a Rails controller.

To invoke a controller, you add an attribute named data-controller to a DOM element on your page. The value of the attribute is the name of the controller. If the controller’s name is more than one word, you use dash case, so it would be fancy-color, not fancyColor.

The controller has the same scope as the DOM element it’s attached to. This means that any events you want dispatched to the controller need to happen inside the controller’s DOM element. Any elements that you designate as targets for the controller also need to be inside the controller’s DOM element.

Creating a controller for show/hide

In our app we want to make a working version of the show/hide button for each day, so we want to press the button, hide the concerts for that day, and change ...