Get form textbox values as array using angularjs

Question

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',
    ]
}

Poyraz Yilmaz · Accepted Answer · 2014-03-13 12:28:38Z

1

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

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

here is a PLUNKER...

answered Mar 13, 2014 at 12:28

Poyraz Yilmaz

5,8671 gold badge28 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

VishwaKumar Over a year ago

Oh it works! Thanks, but when i erase the submited value from textbox a null value is still left. cant i remove/ reset the names??

Poyraz Yilmaz Over a year ago

you can check validation of form if it is ok for you?

VishwaKumar Over a year ago

sorry dint get what you saying

Poyraz Yilmaz Over a year ago

@VishwaKumar you can watch and remove element from your array but I don't think it is a best solution, I wonder what you want to get when form is submitted we can focus that for another solution...]

VishwaKumar Over a year ago

Well , we have to make a check if the array value was present or no in a loop on the server side..wanted to just avoid that step

Collectives™ on Stack Overflow

Get form textbox values as array using angularjs

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related