我有一个名为leave_start
的日期选择器,我希望能够设置一个非静态的最小日期,以便一个人可以在他们选择的那天之后选择日期。我怎么能做这样的事情,由于某种原因,当我点击未来的选择框时,它不会重新加载日期选择器我怎么能解决这个问题呢?
因此,当他们为将来的选择框选择是或否时。它会相应地重新格式化日期选择器。
所以这是我的观点,其中sick_day输入将是病假文本字段将是他们将设置的最小日期。
=simple_form_for @entry, :url => url_for(:controller => 'entry', :action
%td.lt= f.error :range_days, :class => 'er'
%table.table.table-bordered.table-striped{:style => 'table-layout:fixed; width:100% !important;'}
%td.lt= f.text_field :sick_day, :id => 'sick_day', :placeholder => 'Optional Comment', :input_html => {:value => ''}
%td.lt= f.error :indirect_id, :class => 'er'
%table.table.table-bordered.table-striped{:style => 'table-layout:fixed; width:100% !important;'}
%th.lt
%td.lt= f.input_field :future, :as => :select, :id => 'future', :label => false, :collection => ["YES", "NO"]
%td.lt= f.error :future, :class => 'er'
%table.table.table-bordered.table-striped{:style => 'table-layout:fixed; width:100% !important;'}
%th.lt Leave Start:
%td.lt= f.text_field :leave_start, :label => false, :id => 'leave_start', :input_html => {:value => ''}
%td.lt= f.error :leave_start, :class => 'er'
%table.table.table-bordered.table-striped{:style => 'table-layout:fixed; width:100% !important;'}
= f.button :submit, "Submit", :class => 'customSub'
这是我的JavaScript
$(document).ready(function(){
$('#future').click(function() {
var selected = $(this).val();
var new_day = $('#sick_day').val();
if (selected == 'YES') {
$('#leave_start').datepicker({minDate: new_day });
}
if (selected == 'NO') {
$('#leave_start').datepicker({minDate: 0, beforeShowDay: $.datepicker.noWeekends });
} else {
}
});
});
我试过这个但是出错了(TypeError:“#sort_day”.val不是函数)
答案 0 :(得分:1)
初始化datepicker后,更改选项的方法不同see API
需要在更改的值对/数组之前添加"option"
。
试试这个:
$(document).ready(function(){
//create datepicker
$('#leave_start').datepicker();
$('#future').click(function() {
var selected = $(this).val();
var new_day = $('#sick_day').val();
if (selected == 'YES') {
$('#leave_start').datepicker("option", "minDate", new_day );
} else if (selected == 'NO') {
$('#leave_start').datepicker("option", {minDate: 0, beforeShowDay: $.datepicker.noWeekends });
}
});
});