Store data from these inputs in an array to pass in formdata

Question

HTML part

  <div ng-repeat="tag in tags">
        <input type="text" ng-model="user.tags" />
    </div>

Angular part

$scope.tags = []
    $scope.addTag = function() {
        $scope.tags.push({
    })
}
var info = new FormData();
info.append("tags", $scope.tags);

so i want to store the data from all tag in tags in a single array. I need to pass that array to formData element info

why do you have ng repeat – Sajeetharan Jun 17 '17 at 07:17 — Sajeetharan, Jun 17 '17 at 07:17
to show inputs for each index of the array – Shubham Bhardwaj Jun 17 '17 at 08:01 — Shubham Bhardwaj, Jun 17 '17 at 08:01

score 2 · Answer 1 · answered Jun 17 '17 at 07:49

2

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

app.controller("myCtrl", function($scope) {
    $scope.tags = [];
        
    $scope.myFunction = function() {
      if($scope.x){
         $scope.tags.push($scope.x);
         $scope.x = "";
       }
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app' ng-controller="myCtrl">
    <div ng-repeat="tag in tags track by $index">
        <input type="text" ng-model="tag" />
    </div>
        <input type="text" ng-model="x" />
        <button ng-click="myFunction()">Click Me!</button>
</div>

answered Jun 17 '17 at 07:49

Hassan Imam

21,956
5
41
51

I tried your code, it stores the variables in an array but when i pass it to formData its no longer an array – Shubham Bhardwaj Jun 17 '17 at 08:13
Please refer [this](https://stackoverflow.com/questions/16104078/appending-array-to-formdata-and-send-via-ajax) for your second part. – Hassan Imam Jun 17 '17 at 15:37

score 1 · Accepted Answer · answered Jun 20 '17 at 05:07

Improving on the answer by @HassanImam

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

app.controller("myCtrl", function($scope) {
    $scope.tags = [];
        
    $scope.hisFunction = function() {
      if($scope.x){
         $scope.tags.push($scope.x);
         $scope.x = "";
       }
    }

    $scope.myFunction = function() {
      $scope.tagss="[\"";
      var i=0;
      for(i=0;i<$scope.tags.length;i++){
         $scope.tagss=$scope.tagss+$scope.tags[i];
         if(i<$scope.tags.length-1)
         $scope.tagss=$scope.tagss+"\",\"";
      }
      $scope.tagss=$scope.tagss+"\"]";

      var info = new FormData();
      info.append("tags", $scope.tagss);
      for (var pair of info.entries()) {
         console.log(pair[0]+ ', ' + pair[1]); 
      }
    }

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app' ng-controller="myCtrl">
    <div ng-repeat="tag in tags track by $index">
        <input type="text" ng-model="tag" />
    </div>
        <input type="text" ng-model="x" />
        <button ng-click="hisFunction()">Add</button>
        <button ng-click="myFunction()">Submut</button>
</div>

I know this is not a proper solution, but hey it works.
I hope it helps.

Store data from these inputs in an array to pass in formdata

2 Answers2