CODEWITHSUNDEEP
ruby-on-railstwitter-bootstrapdatepicker
Aravind
Aravind

Reputation: 1401

bootstrap date picker rails not working

read = ->
   $('#date_picker').datepicker

$(document).ready read
$(document).on "page:load", read

This the code I am using the above is how I call the datepicker. I am using date picker rails gem. The below is the form code 

= simple_form_for :due_on,:url=> admin_requests_path,:method => "get",html: {id: "due_on_filter"}  do |f|
  = f.input :mydate,:disabled => 'disable', :input_html => { :data => {:behaviour => :datepicker },id: "date_picker"}

I am not able to get it to work. There are no errors but datepicker just does not work.

This is my application.js

//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require jquery.ui.core
//= require jquery_nested_form
//= require dataTables/jquery.dataTables
//= require dataTables/jquery.dataTables.bootstrap3
//= require datatable_calls
//= require nprogress
//= require nprogress-turbolinks
//= require chosen-jquery
//= require chosen_calls
//= require filter_ajax_calls
//= require bootstrap-datepicker/core
//= require custom

HTML raw output of the form is:

<form accept-charset="UTF-8" action="/admin/requests" class="simple_form due_on" id="due_on_filter" method="get" novalidate="novalidate">
<div style="display:none"><input name="utf8" type="hidden" value="&#x2713;" /></div>  
<div class="control-group string required due_on_mydate">
<label class="string required control-label" for="date_picker">
<abbr title="required">*</abbr> Mydate</label>
<div class="controls">
<input class="string required" data-behaviour="datepicker" id="date_picker" name="due_on[mydate]" type="text" />
</div>
</div>
</form>

Upvotes: 4

Views: 1479

Answers (2)

Antony Mithun
Antony Mithun

Reputation: 161

Edit in your script as

$(function(){$("#datepicker").datepicker({
showbuttonPanel: true
});
});

and you need to require bootstrap and jquery-ui-1.10.4.custom files in both js & css application. Now implement the datepicker where ever you want using the datepicker id.

Upvotes: 1

AME
AME

Reputation: 2302

you sure this js/coffee code works?

Could you try that please: 

setInterval(function() {
$(function () { 
var datepicker = $('#date_picker');                                                     
        if(datepicker.length) {
            datepicker.datepicker();
            alert("found the element!");
        } else {
            alert("could not find element");
        }    
    });  
}, 4000);

Upvotes: 3

Related Questions