CODEWITHSUNDEEP
javascriptangularjsarraysformsobject
Gabo Ruiz
Gabo Ruiz

Reputation: 556

Store data from input Form AngularJS

I want to store the data of the comment and show it in the view and store in db.

I have this form

    <form>
        <div class="form-group">
            <label>Add a comment</label>
            <input type="text" ng-model="newRole.newAuthor" placeholder="author">
            <input type="date" ng-model="newRole.newDate">
            <input type="file" ng-model="newRole.commentImage">
            <textarea class="form-control metro" ng-model="newRole.newComment"></textarea>
            <h2>{{txtcomment}}</h2> 
        </div>
    </form>
    <button class="btn btn-primary" ng-click="trip.makeComment(newRole)">Comment</button>

and want to store the data here

this.tripObject.comments = [
    {
        "author": "Ronnie Oliver",
        "date": "05/06/16 01:19 PM",
        "imageURL": "/assets/images/placeholders/user.svg",
        "text": "Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nullam quis risus eget urna mollis ornare vel eu leo. Curabitur blandit tempus porttitor."
    },
    {
        "author": "Shaggy Rogers",
        "date": "05/06/16 12:48 PM",
        "imageURL": "/assets/images/placeholders/user.svg",
        "text": "Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Nullam quis risus eget urna mollis ornare vel eu leo. Curabitur blandit tempus porttitor."
    }
];

And this is the controller:

this.makeComment = function(newRole){
                // $scope.txtcomment = '';
                var newRole = {
                    "author":newRole.newAuthor,
                    "date":$scope.newDate,
                    "imageURL":$scope.commentImage,
                    "text" : $scope.newComment
                 }
                console.log($scope.newRole);



                console.log($scope.tripObject.comentario)


                this.tripObject.comments.push($scope.newRole);
                console.log(this.tripObject.comments);



            };

I know that something is wrong with the controller or with the form but I dont know what.

Upvotes: 0

Views: 73

Answers (2)

Er Mitul Parmar
Er Mitul Parmar

Reputation: 33

First Declare

$scope.tripObject={comments:[]};

Then declare

$scope.newRole={};

Then on click makeComment in js

$scope.tripObject.comments.push($scope.newRole);

Here newRole is your object all item will push

Upvotes: 1

Goro
Goro

Reputation: 998

There's no $scope.newDate, etc.-- it's $scope.newRole.newDate, right? Although, since you're passing newRole in as an argument, you could just do this instead:

this.tripObject.comments.push({
  author: newRole.newAuthor,
  date: newRole.newDate,
  imageURL: newRole.commentImage,
  text: newRole.newComment
})

(also, you probably shouldn't reassign newRole to a new variable with the same name).

Upvotes: 0

Related Questions