How to add datetimepicker to a textbox?

问题:

I am having a text_field_tag in rails.

<%=text_field_tag 'promocode_expiration','',class: "promoExp form-control",id: "datetimepicker1",size: 10%>

On click of this text_field i wish to open a datetimepicker, to add date to the field.

How can i achieve it? Can anyone help please? thank you in advance.

回答1:

You need to add this two line :

gem 'momentjs-rails', '>= 2.9.0'
gem 'bootstrap3-datetimepicker-rails', '~> 4.17.37'

Then, You need to do :

$ bundle

Then, Add the following to your JavaScript manifest file (application.js):

//= require moment
//= require bootstrap-datetimepicker

And, modify your application.css and add :

*= require bootstrap
*= require bootstrap-datetimepicker

And Lastly, In your view file :

<div class='input-group date' id='datetimepicker1'>
  <input type='text' class="form-control" />
    <span class="input-group-addon">
      <span class="glyphicon glyphicon-calendar"></span>
    </span>
</div>
<script type="text/javascript">
  $(function () {
    $('#datetimepicker1').datetimepicker();
  });
</script>

This had worked for me.

回答2:

You need to add the jquery datetimepicker gem to add this functionality. Here is the link: https://github.com/Envek/jquery-datetimepicker-rails

回答3:

first you need to add datapicker Gem into your Gemfile

gem 'bootstrap-datepicker-rails'

run bundle install

Add this line to app/assets/stylesheets/application.css

 *= require bootstrap-datepicker

Add this line to app/assets/javascripts/application.js

//= require bootstrap-datepicker

in view just paste html code

<input type="text" data-provide='datepicker' >

or

<input type="text" class='datepicker' >

<script type="text/javascript">
  $(document).ready(function(){
    $('.datepicker').datepicker();
  });
</script>

回答4:

Just want to provide an alternatice gem, which doesn't have any other dependency;

gem 'laydate-rails'

https://github.com/AlbaHoo/laydate-rails, it's working well.