VishwaKumar
VishwaKumar

Reputation: 3433

Get form textbox values as array using angularjs

I have the following form

<div ng-controller="Formctrl">
<form ng-submit="getNames(pd)">
    <fieldset>
        <div class="row">
        <section class="col col-4" ng-repeat="n in [] | range:5">
        <label class="input">
            <input type="text" placeholder="Names" ng-model="pd.names[$index]" >
        </label>
        </section>
        </div>
    </fieldset>
</form>
</div>

Basically i want to bind the names in an array form submission. But i am getting the following error

TypeError: Cannot set property '0' of undefined

Here is my Controller

angular.module('myApp')
    .controller('FormCtrl', function($rootScope,$scope){
        $scope.pd = {};
        $scope.getNames = function() { console.log($scope.pd); };

    });

I need the output something like below. How do i achieve it??

{
    names: [
        'Name 1',
        'Name 2',
        'Name 3',
        'Name 4',
    ]
}

Upvotes: 0

Views: 2754

Answers (1)

Poyraz Yilmaz
Poyraz Yilmaz

Reputation: 5857

Hey You just try to reach an undefined element just define names in controller...

$scope.pd = {names : []};

here is a PLUNKER...

Upvotes: 1

Related Questions