Sha*_*waj 3 jquery datepicker angularjs
日期选择器工作正常,但当我添加ng-重复它停止工作.我如何混合角度和jquery？如果有人有想法善意的建议.我在线添加了所有图书馆.日期选择器工作正常,但当我添加ng-重复它停止工作.我如何混合角度和jquery？如果有人有想法善意的建议.我在线添加了所有图书馆.日期选择器工作正常,但当我添加ng-重复它停止工作.我如何混合角度和jquery？如果有人有想法善意的建议.我在线添加了所有图书馆.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script>
angular.module('App', [])
.controller('AppCtrl', function ($scope) {
$scope.selects = [{}]; // default 1 sets
$scope.add = function()
{
$scope.selects.push({});
}
$scope.remove = function(item)
{
angular.forEach($scope.selects, function(value, key)
{
if (value == item)
{
$scope.selects.splice(key, 1);
}
});
$scope.sdate=$('selecting.sdate').datepicker({
minDate:0,
onSelect:function(y){
$('selecting.edate').datepicker();
$('selecting.edate').datepicker('option','minDate',y);
}
});
}
});
</script>
</head>
<body>
<div ng-app="App">
<div ng-controller="AppCtrl">
<form>
<div ng-repeat="selecting in selects">
<input id="sdate" ng-model="selecting.sdate">
<input id="edate" ng-model="selecting.edate">
<input type="button" value="remove" ng-click="remove(selecting)">
</div>
<br><br>
<input type="button" value="add" ng-click="add()">
</form>
</div>
</body>
</html>
要在动态添加的文本框中使用datepicker,请添加以下脚本.
$(function() {
$('body').on('focus',".mydatepicker", function(){
$(this).datepicker();
});
});
你的最终html需要如下所示.
<div ng-app="App">
<div ng-controller="AppCtrl">
<form>
<div ng-repeat="selecting in selects track by $index">
<input class="mydatepicker" ng-model="selecting.sdate" >
<input class="mydatepicker" ng-model="selecting.edate" >
<input type="button" value="remove" ng-click="remove(selecting)">
</div>
<br><br>
<input type="button" value="add" ng-click="add()">
</form>
</div>
</div>
工作的JSFiddle也是如此.
| 归档时间： |
|
| 查看次数： |
3434 次 |
| 最近记录： |