javascript - getting data from dynamically added form in angular -
i'm developing app using mean stack. i'm able add form elements dynamically cannot inserted data in ng-model. if put ng-model="something.something"
every dynamically added form elements takes same data. wish take data in form of object inside array.i appreciate response.
here html code:
<div layout-gt-sm="row" ng-repeat="(key,aca) in vm.academic"> <md-input-container class="md-block" flex-gt-sm> <label>degree</label> <input name="degree" ng-model="vm.academic[key].degree"> </md-input-container> <md-input-container class="md-block" flex-gt-sm> <label>university/board</label> <input name="university" ng-model="vm.academic[key].university"> </md-input-container> <md-input-container class="md-block" flex-gt-sm> <label>percentage/grade</label> <input name="grade" ng-model="vm.academic[key].grade"> </md-input-container> </div> <div layout="row" layout-align-gt-sm="end"> <md-button class="btn1" aria-label="add button" ng-click="vm.add();"> <md-icon md-svg-icon="plus"></md-icon> <md-tooltip md-direction="top"> add more field </md-tooltip> </md-button> </div>
and js code
vm.academic = [{}]; vm.add = add; function add() { console.log('button clicked'); vm.academic.push({ degree:'', university:'', grade:'' }); };
how different ng-model different fields save data in database?
this html code format html
<form name="formname" novalidate> <div layout-gt-sm="row" ng-repeat="aca in vm.academic"> <md-input-container class="md-block" flex-gt-sm=""> <label>name</label> <input type="text" ng-model="aca.name" > </md-input-container> <md-input-container class="md-block" flex-gt-sm=""> <label for="email">email id</label> <input type="email" ng-model="aca.email"/> </md-input-container> </div> </form>
and in controller initialize vm.academic = [{}];
, call add , remove methods follows
vm.addnewacademic = function(){ vm.academic.push({}); }; vm.removeacademic = function() { var num = vm.academic.length-1; if ( num !== 0 ) { vm.academic.pop(); } };
you'll in output result [{'name':'a','email':'bb'},{'name':'c','email':'dd'}]
Comments
Post a Comment