Pickadate is not a function. Rails

Question

This is my first time in SO. My concern is that I get

Uncaught TypeError: $(...).pickadate is not a function

error in the console.

Before that, I was able to include the files (picker.js, picker.date.js, picker.time.js) detected in the Javascript [F12 in Chrome].

Here are the other codes:

_form.html.erb

<div class="pure-control-group">
    <%= t.label :start_date %>
    <%= t.text_field :start_date, class: 'datepicker' %>
</div>

application.js

//= require_self
//= require jquery
//= require rails-ujs
//= require angular
//= require angular-animate
//= require angular-resource


//= require picker
//= require picker.date
//= require picker.time
//= require globals
//= require users

globals.js

$(document).ready(function(){

    $('p').click(function(){
        $(this).hide();
    });

    $('.datepicker').pickadate();

});

Answer 1

For me, such an issue was caused by the jquery I was using or lack thereof. I had to install jquery using yarn:

yarn add jquery

Once done, it should be included in your node_modules folder. Confirm you have the following line in your config/initializers/assets.rb :

Rails.application.config.assets.paths << Rails.root.join('node_modules')

You can then include jquery in your assets/application.js like so:

//= require jquery/dist/jquery

For some reason, I couldn't get the jquery-rails package. You can find a related resource with more detailed instructions here , though it is one used to install bootstrap on rails, it holds the same concept for rails.

Also, make sure you have pickadate-rails gem in your Gemfile and you have run $ bundle install . Retain these changes in your application.js

//= require picker
//= require picker.date
//= require picker.time

Restart your server too after making the changes.

For more info on how to implement jquery-rails on rails, check this link out: https://medium.com/@chantaljustamond/implementing-pickadate-js-on-a-rails-app-c47af58c33af

Answer 2

You can try this

$(document).ready(function(){

    $('p').click(function(){
        $(this).hide();
    });

    $('.datepicker').pickadate(
    selectMonths: true, // Creates a dropdown to control month
    selectYears: 3 // Creates a dropdown of 15 years to control year
  });
);

});

or if i didnt solve your problem then you can try the rails way that is adding gem in gemfile and then run the command. the best gem for pickadate is pickadate-rails