简体   繁体   中英

AngularJS form validation while adding dynamic elements

I have a form with AngularJS validation.
The problem is that I add input elements to this form using Jquery and AngularJS doesn't add those elements into the form's validation..
Here's an example: http://jsfiddle.net/ULEsy/

var input = $compile($('<input type="text" ng-model="textinput" required />'))($scope);
$("#someform").append(input);

In the example, even though the input field is not valid (empty - can be seen by the red border), the entire form is valid. Any help?

@Ephi and I found a solution for this problem. Apparently, you need to first append the element to the DOM, and only then use $compile. Also, the new element needs a name.

See here

angular.module("app", []).controller('someController', function($scope, $compile) {   
    $scope.add = function() {
        var input = $('<input type="text" ng-model="textinput" name="x" required />');
        $("#someform4").append(input);    
        $compile(input)($scope);
    }
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM