Skip to content Skip to sidebar Skip to footer

Ng-form Inside Ng-repeat With Submit Button Outside Of Ng-repeat

I've this code:

Solution 1:

Based on you comment and following the same goal of generating a form for each element in your ng-repeat, this should be the answer:

html

<formname="generalForm"><!-- this form will be valid if all sub-forms are valid--><divclass="row"ng-repeat="input in inputs | filter:inputNumber"><ng-formname="form1"><divclass="col-xs-3"><divclass="form-group"><inputng-model="inputs.number[$index]"type="number"name="number$index"class="form-control"placeholder=""min="1"max="9999"required /><smallclass="label label-danger"data-ng-show="submitted && form1.number$index.$error.required">required</small><smallclass="label label-danger"data-ng-show="submitted && form1.number$index.$error.number">number</small><smallclass="label label-danger"data-ng-show="submitted && form1.number$index.$error.max">number max</small></div></div></ng-form></div><buttondata-ng-click="add(generalForm)"class="btn-add"style="padding-left: 40%;"></button></form>

controller

// Form add handler.$scope.add = function(form) {
    // Trigger validation flag.$scope.submitted = true;

    // If form is invalid, return and let AngularJS show validation errors.if (form.$invalid) {
        console.log('invalid');
        return;
    } else {
        var newItemNo = $scope.inputs.length + 1;
        var inputs = { 'id': 'input' + newItemNo }
        $scope.inputs.push(inputs);
        $scope.isDisabled = false;
    }
};

Post a Comment for "Ng-form Inside Ng-repeat With Submit Button Outside Of Ng-repeat"