ng-grid cellTemplate“AngularJS”中的Bootstrap Datepicker控件

时间:2015-06-02 21:23:12

标签: angularjs angular-ui-bootstrap ng-grid

我正在使用ng-grid并将bootstrap日历控制绑定到ng-grid上,如下所示

 $scope.EmployeeGridOptions.columnDefs = [
{
               field: 'requestStartDate', displayName: 'Start Date',
               cellTemplate: '<input ng-click="open($event,row.rowIndex)" 
ng-model="row.entity.requestStartDate" datepicker-append-to-body=true datepicker-popup="MM/dd/yyyy" is-opened="false"></input>'
}
]

我想在用户点击文本框时打开数据选择器控件。现在,datepicker一直在打开。有什么方法可以在触发open函数时打开datepicker的实例。

$scope.calandar=function($event,row){
            $event.preventDefault();
            $event.stopPropagation();

            $scope.opened2 = true;

        }

对此表示高度赞赏。谢谢。

2 个答案:

答案 0 :(得分:0)

尝试使用ng-focus代替ng-click

答案 1 :(得分:0)

因为我在网页上有多个日历控件。内置角度没有日历控件。我在网页上没有分页。 Bootstrap日历控件非常昂贵。因此,通过性能问题和功能使用Jquery日历控件。谢谢。

 $scope.OpenDatePicker = function (row, rowId) {
             lastId = rowId + row.entity.employeeId;
             position = $("#" + lastId).offset();

             $("#dtpicker").val($("#" +lastId).val());

            $('#dtpicker').datepicker('option', 'minDate', $("#PayPeriodEndDateMin").val());
            $('#dtpicker').datepicker('option', 'maxDate', $("#PayPeriodEndDate").val());

            $(".ui-datepicker-trigger").trigger("click");
        }