I have a problem that I'm having a hard time with, I don't know how I can add into second row when I click the button using angularJS it always on the first row, sorry for my english.
Here's my template
<div class="col-md-6" style="padding: 0px" ng-if="populateForm">
<div id="divGrid" class="dv well" ng-repeat="form in populateForm" ng-if="form.field_type == 'gridview'">
<div class="row clearfix">
<div class="col-md-9"></div>
<div class="col-md-3" >
<button type="button" ng-click="AddRow(form)" data="{{form.field_id}}" id="AddBtn{{form.field_id}}" class="btn btn-success float-right btnCus" >+</button>
<a ng-click="removeRow($event)" id="RemBtn{{form.field_id}}" data="{{form.field_id}}" class="btn btn-warning float-right btnCus" ng-disabled="BtnDisable">-</a>
</div>
<div class="col-md-12 table-responsive " style="padding: 0 3px;" id="parent{{form.field_id}}" >
<table class="table table-bordered" border="" cellpadding="" cellspacing="" style="background-color:white" id="parent{{form.field_id}}">
<thead>
<tr >
<th ng-repeat="gridDColumn in form.GridList">{{gridDColumn.field_title}}</th>
</tr>
</thead>
<tbody>
<tr>
<td ng-repeat="gridData in form.GridList">
<div ng-if="gridData.field_type == 'Textbox' && gridData.field_datatype == 'Text'">
<div ng-if="gridData.field_required == 'True'">
<div class="control-group has-feedback">
<div class="Textbox">
<div ng-if="gridData.enable_textformat == 'True'">
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" placeholder="{{gridData.field_textformat}}" type="text" ng-required="{{gridData.field_required | lowercase}} && {{gridData.field_standard | lowercase}} == true" class="col-md-5 rectangle form-control"/>
</div>
<div ng-else>
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" type="text" placeholder="" ng-required="{{gridData.field_required | lowercase}} && {{gridData.field_standard | lowercase}} == true" class="{{gridData.field_required}} col-md-5 rectangle form-control"/>
</div>
</div>
</div>
</div>
<div ng-if="gridData.field_required == 'False'">
<div class="control-group">
<div class="Textbox">
<div ng-if="gridData.enable_textformat == 'True'">
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" placeholder="{{gridData.field_textformat}}" type="text" ng-required="{{gridData.field_required | lowercase}} && {{gridData.field_standard | lowercase}} == false" class="col-md-5 rectangle form-control"/>
</div>
<div ng-else>
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" type="text" placeholder="" ng-required="{{gridData.field_required | lowercase}} && {{gridData.field_standard | lowercase}} == false" class="{{gridData.field_required}} col-md-5 rectangle form-control"/>
</div>
</div>
</div>
</div>
</div>
<div ng-if="gridData.field_type == 'Textbox' && gridData.field_datatype == 'Numbers'">
<div ng-if="gridData.field_required == 'True'">
<div class="control-group has-feedback">
<div class="Textbox">
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" placeholder="numbers" type="text" class="col-md-5 rectangle form-control numbersonly"/>
</div>
</div>
</div>
<div ng-if="gridData.field_required == 'False'">
<div class="control-group">
<div class="Textbox">
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" placeholder="numbers" type="text" class="col-md-5 rectangle form-control numbersonly"/>
</div>
</div>
</div>
</div>
<div ng-if="gridData.field_type == 'Textbox' && gridData.field_datatype == 'Date'">
<div ng-if="gridData.field_required == 'True'">
<div class="control-group has-feedback">
<div class="Textbox">
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" placeholder="numbers" type="text" datepicker-popup='dd/MM/yyyy' datepicker-options='dateOptions' is-open='openedGrid' class="col-md-5 rectangle form-control"/>
</div>
</div>
</div>
<div ng-if="gridData.field_required == 'False'">
<div class="control-group">
<div class="Textbox">
<input id="sub{{gridData.field_id }}" name="textinput" ng-model="gridData.value" placeholder="numbers" type="text" datepicker-popup='dd/MM/yyyy' datepicker-options='dateOptions' is-open='openedGrid' class="col-md-5 rectangle form-control"/>
</div>
</div>
</div>
</div>
<div ng-if="gridData.field_type == 'dropdownList'">
<div ng-if="gridData.field_required == 'True'">
<div class="control-group has-feedback">
<div class="dropdownList">
<div >
<select id="sub{{gridData.field_id }}" ng-model="gridData.value" class="form-control" ng-required="true" >
<option value="" >(Select)</option>
<option ng-repeat="dd in gridData.Newvalue" ng-value="dd.dd_value">
{{dd.dd_text}}
</option>
</select>
</div>
</div>
</div>
</div>
<div ng-if="gridData.field_required == 'False'">
<div class="control-group">
<div class="dropdownList">
<div >
<select id="sub{{gridData.field_id }}" ng-model="gridData.value" class="form-control">
<option value="" >(Select)</option>
<option ng-repeat="dd in gridData.Newvalue" ng-value="dd.dd_value">
{{dd.dd_text}}
</option>
</select>
</div>
</div>
</div>
</div>
</div>
<div ng-if="gridData.field_type == 'Checkbox'">
<div class="Checkbox">
<label id="sub{{gridData.field_id }} checkbox" style="font-weight:lighter;" >
<label style="margin-left:-20px;display:none;"> {{gridData.field_desc}}</label>
</br><input id="{{gridData.field_id }}" type='checkbox' class=" gridData.field_required ">
</label>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
My controller
$scope.AddRow = function (obj) {
var se = obj.GridList;
var appendValue = "";
$scope.counter = 0;
angular.forEach(se, function (vals) {
var _dat = angular.copy(vals);
console.log(vals);
se.push(_dat);
})
}
Example screenshot 1 when button copy is not click. not click image When button is clicked screenshot 2. output clicked button image I'm beginner I don't know what exactly todo here it always place on the first row not on the second row.
