angular-validation
angular-validation copied to clipboard
dynamic elements added to scope does not validate
i have a form which has ng-repeat for scope variable timings_edit
<form method="post" name="Form" >
<div class="timing-set" add-timings>
<div class="time-slot-block col-md-12" ng-repeat="(key,value) in timings_edit">
<div class="available-days new-day">
<ul>
<span>Availability</span>
<li ng-repeat="dayname in weekdays" >
<label for="checklabel" class="days">
<input class="checkbox-custom" type="checkbox" ng-model="timings_edit[key]['days'][dayname].checked" ng-checked="timings_edit[key]['days'].hasOwnProperty(dayname)" >
<label class="checkbox-custom-label"></label>
{{dayname}}
</label>
</li>
</ul>
</div>
<div class="available-times new-time">
<p class="input_label_container" ng-class="{'move-label':timings_edit[key].time_from!=''}">
<input type="text" class="input-text timepic" ng-model="timings_edit[key].time_from" add-timepicker validator="required" >
<span class="floating-label">From</span>
</p>
<p class="input_label_container" ng-class="{'move-label':timings_edit[key].time_to!=''}">
<input type="text" class="input-text timepic" ng-model="timings_edit[key].time_to" add-timepicker validator="required">
<span class="floating-label">To</span>
</p>
</div>
<div class="actions">
<div id="timing-set_{{key}}" class="delete-notification hide">
<p>Are you Sure ? </p>
<i class="icon icon-rounded-white icon-check" ng-click="delete_timings(timings_edit[key], $index)"></i>
<i class="icon icon-rounded-white icon-delete-white" ng-click="remove_notification($event,'delete-notification');" ></i>
</div>
<div class="delete-time icon icon-rounded icon-delete" ng-click="prompt_notification($event,'delete-notification');"></div>
</div>
</div>
</div>
<div class="add-btn">
<div class="add-more-time btn" ng-click="add_timing();">
<a>Add new Time slot</a>
</div>
<input type="submit" validation-submit="Form" class="btn dark-btn" ng-click="save_timings();" value="Save timing set" />
</div>
</form>
when i click the add new time slot it pushes an empty object to the scope element
$scope.add_timing = function(){
$scope.$watch('ng-model', function(newval) {
var blank = {'time_from':'','time_to':'','days':{}};
$scope.timings_edit.push(blank);
});
}
on clicking save timing set it does not validate the newly added elements throws angular-combine.js:122 Possibly unhandled rejection: error
maybe you want to simplify the code or showing us a demo link? for us easier to track what's the problem.