带输入掩码的UI-Bootstrap datepicker

问题描述 投票:3回答:2

目前正在尝试使用标准的日期选择器,但将其与输入掩码结合使用,以便在用户需要时更容易手动输入日期。

See Plunk

目前的问题是,当我添加掩码时,会发生两件事之一,或者在字段中输入日期不起作用(意味着一旦我完成它就会删除字段中的值)或者它成功更新模型值但是当我打开datepicker时它被设置为年1500

插件具有屏蔽和未屏蔽的输入版本。

HTML

<input type="text" class="form-control" datepicker-popup="MM/dd/yyyy" ng-model="dt" is-open="opened" min-date="'2010-01-02'" max-date="dt" ng-required="true" close-text="Close" show-weeks="false" show-button-bar="false" ui-mask="99/99/9999" />
<button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>

JS

.controller('DatepickerDemoCtrl', function ($scope) {
  $scope.dt = new Date();

  $scope.open = function($event) {
    $event.preventDefault();
    $event.stopPropagation();

    $scope.opened = true;
  };
});
javascript angularjs twitter-bootstrap datepicker masking
2个回答
0
投票

你不需要面具,因为api会为你做

<input class='form-control' data-provide='datepicker' data-date-format='yyyy-mm-dd'>

0
投票

datetimepicker master是解决方案

jQuery('#datetimepicker_mask').datetimepicker({
 timepicker:false,
 mask:true, // '9999/19/39 29:59' - digit is the maximum possible for a cell
});

http://xdsoft.net/jqplugins/datetimepicker/

© www.soinside.com 2019 - 2024. All rights reserved.