2013-05-03 72 views
0

在rails 3.2.9中,我使用引導程序的日期選擇器來顯示日期。在一個單一的表格中,我需要顯示2個字段的日期選擇器。 如果我點擊第一個字段,那麼datepicker會彈出。之後,如果我點擊「標籤」按鈕,那麼它會通過附加到第一個日期選擇器來彈出第二個字段的日期選擇器。 我需要爲特定字段的onclick一次顯示一個日期選擇器。如果我點擊「選項卡」按鈕,那麼應該隱藏第一個字段的日期選擇器,並彈出第二個字段的日期選擇器。引導日期選擇器一次追加2個字段

JavaScript是像下面

function currentDatePicker(id){ 
var nowTemp = new Date(); 
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0); 

$('#' + id).datepicker({ 
    format: "yyyy-mm-dd", 
    onRender: function(date) { 
     return date.valueOf() < now.valueOf() ? 'disabled' : ''; 
    } 
}); 

}

在觀點,

<%= f.input :start_date, :as=>:string, :label =>"Start Date", :required => false, 
    :input_html=>{:readonly=>true, :value=>@user.start_date.blank? ? "" : @user.start_date} %> 

<%= f.input :end_date, :as=>:string, :label =>"End Date", :required =>false, 
    :input_html=>{:readonly=>true, :value=>@user.end_date.blank? ? "" : @user.end_date} %> 

<script type="text/javascript"> 
currentDatePicker('user_start_date'); 
currentDatePicker('user_end_date'); 
</script> 

for more information I have added the image

上面我已經加入的圖像以獲取更多信息。請幫我解決這個問題。

+0

你可以在你調用currentDatePicker函數的地方發佈一部分代碼嗎? – 2013-05-03 10:33:38

+0

我編輯了問題 – 2013-05-03 11:27:30

回答

1

您可以對日期選擇器使用不同的ID,然後在ID上使用事件處理。點擊第二日期選擇器時,隱藏手動第一日期選擇器。 或使用datepicker的autoclose屬性。 $('#from')。datepicker({autoclose:true,startDate:today.getDate.toString()}); $('#to')。datepicker({autoclose:true,startDate:today.getDate.toString()});

form和#to都是id。

+0

我希望autoclose能夠解決您的問題。 – 2013-05-03 13:03:34

1

我遇到了完全相同的問題。我通過執行以下操作解決了這個問題:

var pickers = $(".datepicker") 
    .datepicker({ 
     format: "mm/dd/yy", 
     autoclose: true 
    }) 
    .on("show", function(e){ 
     pickers.not(e.currentTarget).datepicker("hide"); 
    });