Angularjs input form array post as array of json objects

Question

in html, i wanna create a input form which gives me this result on post, on sign up, i want to post user address as array of addresses have objects like "gender" : "MALE", "addresses" : [{ "street" : "123 street", "post_code" : "45663" }]

Html i wrote like

<input type="text" ng-model="user.addresses[].street" >
<input type="text" ng-model="user.addresses[].post_code" >.

Actually i don't wanna populate, i want the array of object when i'll post the form. — Muhammad Junaid
– Muhammad Junaid, Commented Apr 8, 2015 at 19:08
Thanks guys, i've solved this. Here is the answer. jsfiddle.net/junaidcs/b9p50yjt/2 — Muhammad Junaid
– Muhammad Junaid, Commented Apr 8, 2015 at 19:37

sylwester · Accepted Answer · 2015-04-08 19:04:48Z

1

Please see demo below

var app = angular.module('app', []);

app.controller('firstCtrl', function($scope) {
  $scope.user = {

    gender: "MALE",
    addresses: [

      {
        street: "123 street",
        post_code: "45687"
      }

    ]

  }
});

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="app">
  <div ng-controller="firstCtrl" class="container">
    <label>Gender</label>
    <input type="text" ng-model="user.gender" class="form-control">
    <br/>
    <div ng-repeat="address in user.addresses">
      <label>Street</label>
      <input type="text" ng-model="address.street" class="form-control">
      <br/>
      <label>Postcode</label>
      <input type="text" ng-model="address.post_code" class="form-control">
      <br/>
    </div>
    <pre>{{user | json}}</pre>


  </div>
</body>

answered Apr 8, 2015 at 19:04

sylwester

16.5k1 gold badge27 silver badges33 bronze badges

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

2 Comments

Muhammad Junaid Over a year ago

Actually i don't wanna populate, i want the array of object as request when i'll post the form

Muhammad Junaid Over a year ago

Thanks, @sylwester, i've solved this like jsfiddle.net/junaidcs/b9p50yjt/3

Collectives™ on Stack Overflow

Angularjs input form array post as array of json objects

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related