2009-08-16 111 views
3

我有一個問題,即時加載到一個窗體,具有日期的頁面div。我想在那裏得到datepicker,但是當頁面用ajax加載時,jquery沒有看到我的輸入。我想是這樣的:jquery ui datepicker在ajax加載頁面

$('#birthdate').live('click', function() { 
    $(this).datepicker({showOn:'focus'}).focus(); 
}); 

以及它的工作,但整個日期選擇器閃爍,有時不顯示等 有沒有一種可能是從我生病顯示日期選擇自己onlcik功能? 類似:

function choosedate() { 
    $('#birhtdate').datepicker(); 
} 

它不僅與日期選擇器,我只是不知道如何使用jquery裏面AJAX加載頁面。

回答

8

在處理您的ajax響應時,您應該可以調用$("#yourdate").datepicker()

例如:

$.get("new_div_contents.whatever", function(data) { 
    // do your thing with the data 
    $("#yourdate").datepicker(); 
}); 
0

我的關注分離成兩種組分。

  1. 設置的日期選擇爲焦點
  2. 給輸入焦點時,頁面被更新要顯示的輸入。

現在,如果通過AJAX調用更新輸入,則需要在加載日期選擇器時重新應用日期選擇器。這是因爲任何以前的元素(被替換)都將從DOM中除去,並且還會爲datepicker處理程序。如果沒有,那麼你只需要將datepicker與input元素關聯一次。賦予元素焦點並觸發焦點事件處理程序應導致顯示任何關聯的日期選擇器。

$.get('/url/to/action', function(data) { 
    $('#birthdate').datepicker({ showOn: 'focus' }); 
    var bd = $('#birthdate').focus().get(0); 
    if (bd) bd.focus(); 
}); 

注意,jQuery文檔是關於調用焦點()jQuery對象是否實際上給聚焦到元件或簡單地調用焦點事件處理程序不清楚。上面的代碼假設它沒有給出元素焦點,所以使用javascript方法完成。這可能沒有必要,但我沒有嘗試過,並且取決於(衝突的)文檔。

0

Z-索引是一個選項

$('.datepicker').datepicker({'zindex':1200});