Question

我有一个rails应用程序，我想选择出生日期。我想使用jquery-ui datepicker，但我不确定如何将它实现到我的rails应用程序中。

这是我想要的月份和年份菜单选项的屏幕截图，以便更轻松地选择出生日期。

我真的不确定从我的application.js文件以及我的视图中设置它的位置。

现在我的视图/表单看起来像这样

   <%= f.text_field :patient_dob, :id => 'datepicker' %>

这是我的application.js

$(function() {
  $( "#datepicker" ).datepicker({
    changeMonth: true,
    changeYear: true
  });
});

同样，我希望这是一个jquery-ui datepicker，带有月份和年份选项，可以更轻松地选择生日。

如果有人可以给我一些代码来开始，我会很感激。现在当我点击文本字段时，没有任何反应。

Answer 1

确保在头部html中包含 jquery.js ， jquery-ui.js ， jquery-ui.css 标签
jQuery和jQuery-ui javascript文件只能声明一次。您可以通过右键单击您的网页（例如，在Chrome中）并选择查看源代码来检查这一点。此外，在源代码上单击jquery.js，jquery-ui.js，jquery-ui.css和application.js链接并确保您的代码在那里（如果找不到预期的代码，请检查您的路径）。
application.js文件应在 jquery和jquery-ui之后声明为。

所以你的＆lt;头＆gt;应该是这样的：

<head> <meta [your code]> <title>[your code]</title> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> <%= javascript_include_tag "application.js" %> </head>

Answer 2

经过一些搜索和实验，这段代码为我完成了。看来我之前使用的不是对象，或者我把它关闭了。

$(function(){
  $('#datepicker').datepicker({
    changeMonth: true,
    changeYear: true,
    yearRange: '1900:2013'      
  });
  $('#datepicker').datepicker('option', 'dateFormat', 'yy-mm-dd');
});

Jquery-ui datepicker有几个月和几年的菜单栏

2 个答案: