Bootstrap date picking rails do not work

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

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

This code that I use above, I call datepicker. I use a date pick rails gem. 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 can not make it work. There are no errors, but the datepicker just does not work.

This is my application.js application

//= 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 form output:

<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>
+4
source share
2 answers

Are you sure this js / coffee code works?

Could you try:

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

Change in script how

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

and you need the files bootstrapand jquery-ui-1.10.4.customapplications js and css. Now implement datepicker wherever you want to use the datepicker id.

+1

Source: https://habr.com/ru/post/1539393/


All Articles