我在我的离子应用程序中使用 jquery UI datepicker 小部件。
我想在离子弹出窗口中使用日期选择器，但我无法选择日期，因为弹出窗口在它前面。
关于如何使 datepicker 指令显示在弹出窗口前面的任何想法，以便我可以选择日期？
我的日期选择器指令：
.directive('datepicker', function () {
return {
require : 'ngModel',
link : function (scope, element, attrs, ngModelCtrl) {
$(function(){
$(element).datepicker({
changeYear:true,
changeMonth:true,
dateFormat:'yy-mm-dd',
onSelect:function (dateText, inst) {
ngModelCtrl.$setViewValue(dateText);
scope.$apply();
}
});
});
}
}
});
我的离子弹出代码：
$scope.showPopupExitDate = function() {
var templateDate = '<label class="item item-input">' +
'<span class="input-label">Data</span>'+
'<input datepicker type="text" onkeydown="return false" ng-model="profile.exitDate">'+
'</label>';
// An elaborate, custom popup
var myPopup = $ionicPopup.show({
template: templateDate,
title: 'Data de saída',
subTitle: '(Esta ação é irreversível!)',
scope: $scope,
buttons: [
{ text: 'Cancelar' },
{
text: '<b>Guardar</b>',
type: 'button-energized',
onTap: function(e) {
if (!$scope.profile.exitDate) {
//don't allow the user to close unless he enters exit date
e.preventDefault();
} else {
return $scope.profile.exitDate;
}
}
}
]
});
myPopup.then(function(res) {
console.log('Tapped!', res);
if(res != undefined) {
$scope.update_profile();
} else {
}
});
};
jQuery UI 日期选择器：http: //api.jqueryui.com/datepicker/
[编辑]
我通过添加解决了出现在后台问题的日期选择器
style="position: relative; z-index: 100000 !important;"
到日期选择器输入。但是，我无法单击此处所示的日期选择器https://jsfiddle.net/6wy933zb/