1

我有一个 JQueryUI datepicker 定义如下：

$(function() {
  $(".visit_date").datepicker({
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: "yy-mm-dd"
  });
});

产生 Datepicker 文本框的视图代码是

<td><%= f.label :visit_date %></td>
<td><%= text_field_tag :visit_date, @visit.visit_date, :class => 'visit_date'

并且视图在渲染时会在这样的标签之间生成：

<div id="action_window">
   (rendered HTML to be acted on by user) 
</div>

为什么 Javascript 选择器“.visit_date”不与此视图挂钩？换句话说，没有它曾经工作的“action_window”标签。我的想法是“.visit_date”将与“visit_date”类匹配任何内容。

====================== 2012 年 11 月 7 日更新。Javascript代码：

$(function() {
  $("#visit_date").datepicker({
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    dateFormat: "yy-mm-dd"
});

});

用户按下按钮的原始位置：

<%= link_to "Add Visit", new_client_visit_path(@client), :remote => true, :class => "btn btn-primary btn-large" %>

在访问控制器中：

respond_to do |format|
  format.html
  format.js { }
end

在视图/访问/new.js.erb 中：

$('#action_window').html('<%= escape_javascript render(:partial => "new") %>');
$('#action_window').show;

（#action_window 是客户端索引视图中的一个 div）

在视图/访问/_new.html.erb 中：

<%= render "form" %>
<%= link_to "Cancel", @client, :class => "btn btn-primary btn-large" %>

在视图/访问/_form.html.erb 中：

%= form_for [@client, @visit] do |f| %>
<td><%= text_field_tag :visit_date, @visit.visit_date, :class => 'visit_date' %>

我无法让 Datepicker 工作，大概是因为创建“新访问”视图的 HTML 被渲染，并且不知何故 JQueryUI 无法在没有将“hasDatepicker”添加到类的情况下关联它。

4

2 回答 2

1

我认为您对类选择器的假设是正确的。根据我的经验，无论 div 包含什么，datepicker 都应该连接到您选择的任何类/id。我会检查这些事情：

  1. 确保您没有错误地使用两个 jQuery 标签。我这样做了，日期选择器不起作用。

  2. 在此代码之前是否有任何 javascript 代码被破坏？我认为只要遇到第一个错误，JS 执行就会停止。我会在 Chrome 中打开页面，右键单击检查元素，然后查看控制台以查看是否有任何 JS 错误。

这些建议基于您的 Rails 代码生成带有 class="visit_date" 的输入标签的假设。

于 2012-11-05T21:51:52.403 回答
0

当您动态添加要成为日期选择器的元素时，原始静态页面包含说此 jquery 以使某些元素成为日期选择器：

$('.visit_date').datepicker();

当新元素被添加并且它有class='visit_date'时，它不会是一个日期选择器，除非你在它上面调用jquery的数据选择器。

因此，如果您使用 new.js.erb 添加动态 datepicker 元素，您可以这样做：

$('#action_window').html('<%= escape_javascript render(:partial => "new") %>');
$('.visit_date').datepicker();
于 2012-11-07T18:26:16.413 回答