Datepicker - Event does not trigger on fresh page load

  <%= form_tag events_path, method: :get do %>
    <div class="row no-gutters">
      <div class="col">
        <div class="md-form md-outline input-with-post-icon datepicker mt-1">
          <input placeholder="Select Date" type="text" id="selected_date" name="selected_date" class="form-control">
          <i class="fas fa-calendar input-prefix" tabindex=1></i>
        </div>
      </div>
      <div class="col-auto">
        <button type="submit" class="btn btn-primary btn-rounded m-0 align-bottom"><i class="far fa-hand-pointer"></i></button>
      </div>
    </div>
  <% end %>

Grzegorz Bujański staff commented 5 months ago

Hi. Are you sure you have correctly connected MDB on this page? You can check in dev tools if the icon has an event on click?

---

fkmccallion pro premium commented 5 months ago

I just figured out the issue - this is specifically a RoR issue I've ran into before. It is related to turbolinks and to get the functionality to work you will need to wrap the jQuery in an eventlistener as such:

document.addEventListener("turbolinks:load", function(event) { $('.datepicker').datepicker({ min: true, format: 'yyyy/mm/dd' }); // add listener for date change $('.datepicker').on('change', submitForm); function submitForm() { $('#form-submit').submit() } });

---