2016-04-14 6 views
0

Ich habe ein Formular erstellt, um die URL des Hintergrundbildes eines Benutzers zu speichern, wenn sie es vom Standardbild ändern möchten. Ich verwende den Gon-Edelstein, um ihn für Javascript verfügbar zu machen. Ich versuche, es so zu machen, dass, wenn ein Benutzer eine Verbindung in ihrer background_picture Datenbankspalte hat, sie auf das Hintergrund-Bildelement des Körpers angewendet werden sollte und für diejenigen, die nicht das Standardbild haben sollten.Ändern Sie das Hintergrundbild von Körper, wenn Benutzer gibt Link

Ich habe es geschafft, das Hintergrundbild des Benutzers zu ändern, der das Formular erstellt hat, aber für die anderen Benutzer zeigt es nicht das Standardbild an. Dies ist, was ich getan habe, um es an den Benutzer mit dem Link in der Datenbank zu arbeiten.

index.html.erb

<% if current_user.background_picture != :null %> 
    <% @gon.backgroundPicture = current_user.background_picture %> 
<% end %> 

$(document).ready(function(){ 
    if(gon.backgroundPicture !== "") { 
     var background = gon.backgroundPicture; 
     document.body.style.backgroundImage = "url(" + background + ")"; 
    };  
}); 

ich in der Konsole diesen Fehler bin immer wenn ich als ein anderer Benutzer anmelden ,, alles normal mit Ausnahme des Standard-Hintergrundbildes funktioniert, ist es nicht

Started GET "/null" for 127.0.0.1 at 2016-04-14 02:07:04 +0100 
ActionController::RoutingError (No route matches [GET] "/null"): 

Meine Frage ist im Grunde, wie kann ich es erhalten, um das Standardhintergrundbild anzuzeigen, wie es in der CSS-Datei ist, wenn das Feld background_picture des Benutzers leer ist?

+0

Warum nicht einfach das Bild zum Standard machen, aber mit einem Stil von 'visibility: hidden' und" enthüllen "es in Ihrem Skript, wenn Sie das' gon.backgroundPicture' ersetzen würden? – Robusto

+0

Ich habe versucht, verschiedene if-Anweisungen zu meiner if-Anweisung hinzuzufügen, aber keiner von ihnen hat funktioniert, könnte deine Antwort bitte ausführlich sein? – Yoklan

Antwort

0

In Ihrer if-Anweisung if(gon.backgroundPicture !== ""), wenn gon.backgroundPictureundefined ist, es zu true bewerten wird, was ich nicht glaube, ist, was Sie wollen.

Sie könnten die if-Anweisung im JavaScript ändern oder Sie können einen Standardwert in Ihrer Ansicht festlegen.

Try this:

$(document).ready(function(){ 
    if(gon.backgroundPicture) { 
    var background = gon.backgroundPicture; 
    document.body.style.backgroundImage = "url(" + background + ")"; 
    };  
}); 
+0

Das hat funktioniert, danke. – Yoklan

0
das gesamte Skript in der if-Block verschieben

und die Bedingungen ändern, für das Vorhandensein des Bildes zu überprüfen.

Verwandte Themen