From the course: Hotwire: Reactive Ruby on Rails Applications

Unlock the full course today

Join today to access over 24,900 courses taught by industry experts.

Adding targets

Adding targets

- [Instructor] In this video we'll learn how to create a target to connect the DOM element to the JavaScript controller. Open the page one template and instead of connecting to the Hello controller we'll connect to colors, our new controller. Inside we're going to add some input element. They'll be aligned with Flex box and a separation. The first one is an input text. Disable auto complete, write a placeholder, type an HTML color and set it as a target of the colors controller with the input name. The other element of the flex box is a button, style it, a light gray background, a border, a midtown gray color, rounded corners, and some padding. The content will be color it, underneath will be a small square with some styles, border in black, a size of 32 by 32, rounded corners and separated with a top margin. Set it also as a colors target. We'll name it card. The page will look like this. Open the controller and…

Contents