Modern Front-end Development for Rails/

...

/

Using the Data Store

Using the Data Store

Use the data store that we created in the last lesson.

We'll cover the following...

Let’s start with the CalendarFilterController. We need to define it in the ERb for the schedule show page. Right at the top of the file, the loop over the calendar days now looks like this:

Press + to interact
<% @schedule.schedule_days.each do |schedule_day| %>
  <% date_string = schedule_day.day.by_example("2006-01-02") %>
  <section class="column"
            data-controller="calendar-filter"
            data-calendar-filter-selected-class="has-text-danger"
            data-calendar-filter-date-value="<%= date_string %>">
    <div class="has-text-centered js--schedule-day"
          data-action="click->calendar-filter#toggle"
          data-calendar-filter-target="display">
      <%= schedule_day.day.by_example("Jan 2") %>
    </div>
  </section>
<% end %>

There’s a lot going on here, in part because some existing Stimulus controllers are also being tagged. Inside the section tag, we declare the data-controller=calendar-filter and also use the Stimulus class and values API to define a hidden class and a date value, which is a string representation of the date formatted like 2020-01-21. The div tag inside the ...