Jquery Ui Datepicker ay/yıl açılır pencere en son açılan pencerede çalışmıyor

Question

Bir şekilde benim jQuery UI Datepicker Ay/Yıl açılan en son firefox içinde herhangi bir pop-up çalışmıyor.

Ay'ı veya Yıl Açmasını tıkladığımda seçenekler listesi görünmez. Modal kendi üzerine odaklanmayı zorlar çünkü

http://jsfiddle.net/469zV/2/

Answer 1

budur:

$("#dialog-form").dialog({ 
    modal: true 
}); 

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

Ben de JSfiddle üzerinde bir demo hazırlanmıştır:

İşte benim Popup & Datepicker Kod olduğunu. İşte bunun için here belirtildiği gibi bir çözüm. Aşağıdaki betiği js dosyanıza ekleyin. Bu kadar.

jsfiddle: http://jsfiddle.net/surjithctly/93eTU/16/

Ref: Biz GIT elemanları (Got odaklanmak için Sekme kullandığımda vardı Twitter bootstrap multiple modal error

// Since confModal is essentially a nested modal it's enforceFocus method 
// must be no-op'd or the following error results 
// "Uncaught RangeError: Maximum call stack size exceeded" 
// But then when the nested modal is hidden we reset modal.enforceFocus 
var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus; 

$.fn.modal.Constructor.prototype.enforceFocus = function() {}; 

$confModal.on('hidden', function() { 
    $.fn.modal.Constructor.prototype.enforceFocus = enforceModalFocusFn; 
}); 

$confModal.modal({ backdrop : false }); 

Answer 2

modeli içinde odağı kısıtlamak amacıyla

$.fn.modal.Constructor.prototype.enforceFocus = function() { 
$(document) 
    .off('focusin.bs.modal') // guard against infinite focus loop 
    .on('focusin.bs.modal', $.proxy(function (e) { 
    if (this.$element[0] !== e.target && !this.$element.has(e.target).length) { 
     this.$element.focus() 
    } 
    }, this)) 
} 

kullanmak).

Şimdi bu kodu deneyin yıl :)

Answer 3

jquery ui datepicker ile Magnific pop-up (changemonth ve changeyear etkindir)

seçebilirsiniz bu >>

$("#dateOfBirth").datepicker({ 
    beforeShow: function(input, inst) { 
     $(document).off('focusin.bs.modal'); 
    }, 
    onClose:function(){ 
     $(document).on('focusin.bs.modal'); 
    }, 
    changeYear: true, 
    yearRange : '-150:+0' 
}); 

çalıştı

// Added to make calendar drop downs work properly 
$.magnificPopup.instance._onFocusIn = function(e) { 

    if($(e.target).hasClass('ui-datepicker-month')) { 
     return true; 
    } 
    if($(e.target).hasClass('ui-datepicker-year')) { 
     return true; 
    } 
    $.magnificPopup.proto._onFocusIn.call(this,e); 
}; 

Answer 4

Benim durumumda, tarihçinin başarısız olduğuna inandım, ama gerçekte, daha önce başvurulan bir datepicker (bootstrap-datepicker.js) jquery-ui datepicker üzerinde öncelikliydi.

Answer 5

İdeal çözüm, tarih seçicisi pop-up penceresini kalıcı iletişim kutusunun içine taşımaktır.

$("#dialog-form").dialog({ 
    modal: true, 
    width: 500, 
    height: 500 
}); 

$("#datepicker").datepicker({ 
    changeMonth: true, 
    changeYear: true, 
    beforeShow: function(el, dp) { 
      $(el).parent().append($('#ui-datepicker-div')); 
      $('#ui-datepicker-div').hide(); 
     }  
    } 
}); 

Not: biraz css güncellemek gerekecek. Gerçek demo için jsfiddle bağlantısını kontrol edin.

JsFiddle: http://jsfiddle.net/469zV/414/