rubyforgood/casa

<div class="modal show" id="smsOptIn" style="display: block;">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="smsOptIn">
          SMS Opt In
        </h5>
        <a type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </a>
      </div>
      <div class="modal-body">
        <div>
          Please check this box to verify that these mobile numbers have opted in to receive SMS notifications. (They will have the opportunity to opt out or update their preferences.)
        </div>
        <br>
        <span class="form-check checkbox-style">
          <%= form.label :sms_opt_in_label, "Opt into SMS notifications", { class: "form-check-label"} %>
          <%= form.check_box :sms_opt_in, { id: "sms-opt-in-checkbox", class: "form-check-input" } %>
        <span>
      </div>
      <div class="modal-footer">
        <%= form.submit "Continue Import",
{ id: "sms-opt-in-continue-button", class: "main-btn primary-btn btn-hover", disabled: true } %>
      </div>
    </div>
  </div>

  <script type="text/javascript">
      document.getElementById('sms-opt-in-checkbox').addEventListener('change', function (event) {
        document.getElementById('sms-opt-in-continue-button').disabled = !event.target.checked;
      })
  </script>
</div>