使用表单助手实现datepicker

时间:2017-02-06 23:49:37

标签: jquery ruby-on-rails datepicker

所以我正在运行bootstrap-datepicker-rails gem并希望将其实现到我的表单中:

<div class="input-group date">
<input type="text" class="form-control"><span class="input-group-addon"><i class="glyphicon glyphicon-th"></i></span>
</div>

$('#sandbox-container .input-group.date').datepicker({
  maxViewMode: 2,
  multidate: true,
  daysOfWeekDisabled: "0,6",
  daysOfWeekHighlighted: "1,2,3,4,5",
  todayHighlight: true
});

这个东西应该如何看待表单助手? 我目前的代码如下:

    <div class="col-md-2 ">
      <%= f.label :date %><br>
      <%= f.text_field :date %>  
    </div>

我假设jquery代码将转到application.js。

1 个答案:

答案 0 :(得分:1)

您可以按照以下方式执行此操作:

<div class="col-md-2 ">
  <%= f.label :date %><br>
  <%= f.text_field :date, id: "id_datepicker" %>  
</div>

<script type="text/javascript">
  $(function(){
    $('#id_datepicker').datepicker({
      maxViewMode: 2,
      multidate: true,
      daysOfWeekDisabled: "0,6",
      daysOfWeekHighlighted: "1,2,3,4,5",
      todayHighlight: true
    });
  });
</script>

作为jquery datepicker的官方文档,您必须将代码放在jquery

https://jqueryui.com/datepicker/#default