Rails/Bootstrap - Flash notice: sukces jest teraz czerwony, a nie zielony?

Próbowałem znaleźć odpowiedź tutaj, ale nie mogę znaleźć niczego, co działa. W mojej aplikacji rails zaimplementowałem: success and: danger flash notice. To działało zupełnie dobrze, tzn. Sukces był zielony i: niebezpieczeństwo było czerwone, z zamkniętym przyciskiem i wszystkim, ALE od czasu dodania niektórych plików pocztowych mój: sukces jest teraz wyświetlany na czerwono?Rails/Bootstrap - Flash notice: sukces jest teraz czerwony, a nie zielony?

application.html.erb fragment:

<body> 

    <div class="container"> 
    <% flash.each do |key, value| %> 
     <%= content_tag :div, class: "alert alert-#{key == 'notice ? 'success' : 'danger'}" do %> 
     <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <%= value %> 
     <% end %> 
    <% end %> 

    <%= yield %> 
    </div> 

</body>

contact_mailer.rb

class ContactMailer < ActionMailer::Base 
    default to: '[email protected]' 

    def contact_email(name, phone, email, event_type, body) 
    @name = name 
    @phone = phone 
    @email = email 
    @event = event_type 
    @body = body 

    mail(from: email, subject: 'Contact Form Message').deliver 
    end 
end

contacts_controller.rb

class ContactsController < ApplicationController 
    def new 
    @contact = Contact.new 
    end 

    def create 
    @contact = Contact.new(contact_params) 
    if @contact.save 
     name = params[:contact][:name] 
     phone = params[:contact][:phone] 
     email = params[:contact][:email] 
     event = params[:contact][:event_type] 
     body = params[:contact][:comments] 

     ContactMailer.contact_email(name, phone, email, event, body).deliver 
     flash[:success] = 'Message Sent.' 
     redirect_to new_contact_path 
    else 
     flash[:danger] = 'Error occurred, messgage not sent.' 
     redirect_to new_contact_path 
    end 
    end 
end 

private 
def contact_params 
    params.require(:contact).permit(:name, :phone, :email, :event_type, :comments) 
end

i contact_email.html.erb

<!DOCTYPE html> 
<html> 
    <head> 
    <title></title> 
    </head> 
    <body> 
    <p>New Message from Hoot and Holla's Contact form, from <%= "#{@name}, #{@email}" %></p> 
    <p><%= @phone %></p> 
    <p><%= @event %></p> 
    <p><%= @body %></p> 
    </body> 
</html>

Powtarzam, że wszystko działało zupełnie dobrze, zanim materiały do mailera weszły ... ale teraz jestem po prostu zakłopotany. Proszę pomóż!

Źródło

2015-08-06 RuNpiXelruN

Jakiej przeglądarki używasz? – EugZol

Czy używasz skarbu bootstrap sass? I na marginesie, powinieneś umieścić ten mailer w wywołaniu zwrotnym. –

Cześć Justin tak, jestem, i dzięki za napiwek !! .. to by wyczyścić to dużo !! – RuNpiXelruN

Czasami będziesz chciał używać więcej niż notice i success, jak Bootstrap alertsinfo, danger i warning.

Oto rozwiązanie Polecam:

<% flash.each do |key, value| %> 
    <div class="alert alert-<%= key %> alert-dismissible"> 
    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
    <%= value %> 
    </div> 
<% end %>

ten sposób, gdy dzwonisz flash[:success] = 'foo' Twój key byłoby success, a także dla info, warning, danger, itd. W ten sposób można wykorzystać wszystko z różnych Bootstrap alerts.

Dzięki tej metodzie, trzeba będzie dodać jeszcze 2 klas CSS, które rozciągają się na zajęcia Bootstrap, jeśli chcesz użyć składni notice: 'hello world', lub alert: 'oops' w swoich przekierowań, jak redirect_to root_url, notice: 'welcome home'.

Jeśli chcesz z nich korzystać, możesz użyć Sassa, jak poniżej.

.alert-alert { 
    @extend .alert-danger; 
} 

.alert-notice { 
    @extend .alert-warning; 
}

Ponieważ mój komentarz wcześniej zwrotnego mailera był bardziej marginesie i bez związku z tym pytanie, zrobiłem simple gist dla ciebie.

Źródło

2015-08-06 13:16:58

To wspaniale @JustinLicata! Czyści to tak bardzo! (I upraszcza). Dziękujemy za poświęcenie czasu, aby to zrobić, naprawdę to doceniamy! – RuNpiXelruN

Nie ma za co, kolego okrzyki! –

W swojej pętli flash sprawdzasz tylko flash [: notice]. jeśli jest flash [: notice], to stosujesz alert-success. chyba że dotyczy to alert-danger. Więc, co tu zmienię. używam alert-success zarówno dla flash[:success] & . Więc uwagi w _flash.html.erb -

<%= content_tag :div, class: "alert alert-#{['success','notice'].include?(key) ? 'success' : 'danger'}" do %>

Źródło

2015-08-06 11:37:23

Ahh ma doskonały sens! .. thankyou again !! – RuNpiXelruN

Spróbuj tego kodu w układzie aplikacji ...

<div id="wrapper"> 
<div id="page-wrapper"> 
<div class="row"> 
<div class="col-lg-12"> 
<% flash.each do |name, msg| %> 
<%= content_tag(:div, msg, :id=>"#{name}", :class `enter code here`=>"alert alert- info") %> 
<%end%> 
</div> 
</div> 
</div> 
</div> 

<script type="text/javascript"> 
window.setTimeout(function() 
{ 
$("#notice").fadeTo(500, 0).slideUp(500, function() 
{ 
$(this).remove(); 
}); 
}, 5000); 
</script> 
<%= yield%>

Źródło

2015-08-06 11:47:05

Należy docenić pewne wyjaśnienie. – Mark

Oh dzięki tyle @AmitSuroliya !! To zadziałało idealnie !! Próbuję zrozumieć, co się tutaj dzieje w kodzie ... nie sądzę, że mógłbyś podać krótkie wyjaśnienie, dlaczego to działa? ... jeśli nie, to dziękuję! Doceniam to tyle :)

Justin

Ps dla ludzi mających ten sam problem i czytając to .... że roztwór skopiowanie i wklejenie tego do mojego pliku application.html.erb i zastąpienie linii content_tag miałem ... nIE tworzenia częściowej nazwie _flash.html.erb ..just okrywać ktoś tam był coraz mylić :)

Źródło

2015-08-06 12:00:41 RuNpiXelruN

Powitaj Justina ....... w pętli 'flash', sprawdzasz tylko flash [: notice]. jeśli jest flash [: notice], stosujesz sukces alertu. chyba że ma zastosowanie "alert-niebezpieczeństwo". Więc, co tu zmienię. stosuję 'alert-success' zarówno dla' flash [: success] i flash [: notice]. –

Ahh ma doskonały sens! .. thankyou again !! – RuNpiXelruN

Rails/Bootstrap - Flash notice: sukces jest teraz czerwony, a nie zielony?

Odpowiedz

Powiązane problemy