Bootstrap Zeitauswahl Schienen ohne gem

Question

Ich versuche zu

Ich habe ein starts_at:datetime Feld, und ich möchte das Formular ausfüllen mit bootstrap-datetimepicker

hier verwendet, ist meine Form:

= simple_form_for @event do |f| 
    = f.input :title 
    = f.input :starts_at 
    = f.button :submit 

Mein Haupt .js Datei:

$(document).ready(function(){ 
     $(".form_datetime").datetimepicker({format: 'yyyy-mm-dd'}); 
}); 

Wie kann ich diegebender Datetimepicker-Eingabestil?

Answer 1

Es ist generell eine schlechte Idee, zu viel JavaScript in Ihre Ansicht zu werfen. Betrachten Sie JS in eine separate Datei wie folgt bewegen:

%script{:type => "text/javascript", :src => "/js/myscript.js"} 

Ohne den Rest des Codes zu sehen, meine beste Vermutung ist, dass die JavaScripts nicht in der richtigen Reihenfolge geladen werden. JQuery und dann Bootstrap müssten geladen werden, bevor dieser DateTime Picker funktionieren würde.

Sie können this SO Artikel für Informationen zur Skriptbestellung lesen.

Ziehen Sie außerdem in Betracht, den DOM-Verarbeitungscode in eine document.ready callback einzugeben, andernfalls kann der Code ausgeführt werden, bevor er ein DOM-Element zum Anhängen hat.

$(document).ready(function(){ 
    your_code_goes_here(); 
}); 

Answer 2

Sie finden .datetimepicker() Methode auf dem Eingangselement, das Sie die Datumsauswahl geben wollen, müssen nennen. Simple_form sollte ein Element mit dem id "event_starts_at" erzeugen, so versuchen:

$("#event_starts_at").datetimepicker({format: 'yyyy-mm-dd'});

Wenn das nicht funktioniert oder wenn Sie nur das Eingangselement eine andere id geben möchten, können Sie es überschreiben, indem Sie die Option vorbei :

= f.input :starts_at, id: "event_starts_at"