How to insert data in database by dynamically generated input fields with ng-repeat?

Question

I'm creating a functionality in which there is a Add(+) button which adds input fields in the html via angular ng-repeat. Now I need to save this data to the database for which I need help.

This is my HTML

-------------- HTML --------------

<!-- Multiple address -->
                        <table cellpadding="0" cellspacing="0">
                            <tr>
                                <th>Address 1</th>
                                <th>Address 2</th>
                                <th>Zipcode</th>
                                <th></th>
                            </tr>
                            <tbody ng-repeat="m in multiaddress">
                                <tr>
                                    <td><input type="text" id="addone_{{$index}}" value="{{m.addone}}" /></td>
                                    <td><input type="text" id="two_{{$index}}" value="{{m.addtwo}}" /></td>
                                    <td><input type="text" id="zipcode_{{$index}}" value="{{m.zipcode}}" /></td>
                                    <td><input type="button" ng-click="Remove($index)" value="Remove" /></td>
                                </tr>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td><input type="text" id="addone_{{$index}}" ng-model="addData.addone" ng-required="true" /></td>
                                    <td><input type="text" ng-model="addData.addtwo"/></td>
                                    <td><input type="text" id="zipcode_{{$index}}" ng-model="addData.zipcode" ng-required="true" /></td>
                                    <td><input type="button" ng-click="Add([$index])" value="Add" /></td>
                                </tr>
                            </tfoot>
                        </table>

------------------------- My Controller -------------------------

/* For Dynamic address of new subadmin */
$scope.multiaddress = [];
$scope.addData = {};
/* Function to insert multi address input row */
$scope.Add = function(){
    validateData();
    function validateData(){
        var valid;
        valid = checkValid();
        if(valid == true)
        {
            var customer = {};
            customer.addone = $scope.addData.addone;
            customer.addtwo = $scope.addData.addtwo;
            customer.zipcode = $scope.addData.zipcode;
            $scope.multiaddress.push(customer);
            console.log(customer);
            /* Clear the TextBoxes. */
            $scope.addData.addone = "";
            $scope.addData.addtwo = "";
            $scope.addData.zipcode = "";
        }else{
            alert('Please fill details');
            return false;
        }
        function checkValid(){
            var valid = true;
            if($scope.addData.addone == null || typeof $scope.addData.addone == 'undefined' || $scope.addData.addone == ""){
                var valid = false;
            }else{
            }
            if($scope.addData.zipcode == null || typeof $scope.addData.zipcode == 'undefined' || $scope.addData.zipcode == ""){
                var valid = false;
            }else{
            }
            return valid;
        }
    }
};
/* Function to remove multi address input row */
$scope.Remove = function (index) {
    var name = $scope.multiaddress[index].addone;
    $scope.multiaddress.splice(index, 1);
}

My add and remove functionality is working very well. Now the thing is that I'm not getting any solution to save this data to my database. For sending this data to db I need a ng-model assigned to each input. But my input are generated dynamically inside ng-repeat. Can anybody please help me with that?

--- --- --- --- --- --- Update --- --- --- --- --- ---

First of all it was a beginner's question. Let me clear it's doubts / questions :

1. How to add an ng-model to the dynamically generated input?
2. How to send this data to the backend?

Answer 1

I don't know how you are not getting the data? Maybe you are not sending the complete data to backend. At the line :

data: $scope.subadminData

It seems you are sending part of your data. So after changing to new lines :

data: {'sub' : $scope.subadminData, 'address1' : $scope.multiaddress, 'address2' : $scope.addData}

You are getting all or more data now. You may also see, firstly you were only sending a variable now you are sending multiple variables.

Answer 2

I tried a solution for this which is working ->>> I changed this line : data: $scope.subadminData, to this ; data: {'sub' : $scope.subadminData, 'address1' : $scope.multiaddress, 'address2' : $scope.addData}, Now I'm able to send this data to backend.

Any other solution is welcome. :) –