Nach dem Senden Bootstrap modales Formular in Rails, wie Modal mit Fehlern zeigen?

Question

Ich verwende ein Bootstrap-Modal und das Simple_form-Juwel mit Ruby on Rails. Alles läuft gut einmal gesendet. Das Problem ist, wenn Validierungsfehler auftreten, wird das Modal geschlossen, wenn die Übergabeschaltfläche gedrückt wird. Die Fehler werden nur angezeigt, wenn die modale Schaltfläche erneut angeklickt wird.

Ich brauche den Endbenutzer, um die Fehlermeldungen zu sehen, sobald das Formular eingereicht wird - Ich habe gedacht, ich könnte Javascript verwenden, um das Modal neu zu starten, wenn es Fehler gibt, aber ich kann nicht ganz herausfinden, wie. Jede Hilfe wäre großartig, danke.

Mein modal ist wie folgt:

 <%= link_to "Click here &raquo;".html_safe, 
    "#myModal", data: { toggle: 'modal'}, class: "button-main", id: "button-contact" %> 

    <!-- Modal --> 
    <div id="myModal" class="modal fade" role="dialog"> 
     <div class="modal-dialog"> 

     <!-- Modal content--> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">&times;</button> 
      <h4 class="modal-title">Email Contact Form</h4> 
      </div> 
      <div class="modal-body"> 
      <%= simple_form_for @contact, url: contact_path, html: { id: "contact-form" } do |f| %> 
        <%= f.error_notification %> 
      <%= f.input :name, error: 'Name is mandatory, please specify one' %> 
      <%= f.input :email, label: 'Your Email' %> 
        <%= f.input :email_confirmation, label: 'Confirm your Email address' %> 
        <%= f.input :preferred_time, collection: ["Any time", "9am - 12pm Tuesday", "2pm - 6pm Tuesday", "9am - 12pm Wednesday"], selected: "Any time" %> 
        <%= f.input :subject, collection: ["New Appointment", "Request to change existing appointment", "Information", "Other"], selected: "New Appointment" %> 
         <%= f.input :message, as: :text %> 

       <div class="modal-footer"> 
       <%= f.button :submit, "Send", 'data-disable-with' => "Sending...", class: "submit-button", id: "modal-send" %> 
          <p class="warning"> 
           Certain email providers have been known to mark our replies as spam, please be sure to check your junk mail inbox if awaiting a response 
          </p> 
       <% end %> 
      </div> 
     </div> 
     </div> 
    </div> 
</div> 

und mein Modell:

class Contact 

    include ActiveModel::Model 
    include ActiveModel::Conversion 
    include ActiveModel::Validations 

    attr_accessor :name, :email, :email_confirmation, :message, :preferred_time, :subject 

    validates :name, 
     presence: true 

    validates :email, 
     presence: true, length: { minimum: 6, maxium: 30 }, format: { with: /\A([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2,})\z/i }, confirmation: true 

    validates :email_confirmation, 
     presence: true, length: { minimum: 6, maxium: 30 }, format: { with: /\A([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2,})\z/i } 

    validates :message, 
     presence: true, length: { minimum: 6, maxium: 1000 } 

    end 

Dank

Answer 1

Ich bin sicher, es ist nicht das sauberste oder beste Weg, dies zu tun, aber schließlich eine Lösung gefunden, um das Modal nur dann erneut zu laden, wenn es Fehler gibt. Ich habe meiner Seite mit dem Modal einfach folgendes hinzugefügt.

<% if @contact.errors.present?%> 
    <script> 
     $(window).load(function() { 
      $('#myModal').modal('show'); 
      }); 
    </script> 
<% end %>