Adding Our First Controller
Add a controller to the application in this lesson.
We'll cover the following...
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 ...