current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Dismiss
Announcing Stack Overflow Documentation

We started with Q&A. Technical documentation is next, and we need your help.

Whether you're a beginner or an experienced developer, you can contribute.

Sign up and start helping → Learn more about Documentation →
up vote 0 down vote favorite

I have a part of form like this

<input type="text" ng-model="gen.name" ng-repeat="gen in movie.genres">

gen in movie.genre is an object with 2 key value pairs

Object{
 id: 24,
 name : insidious
}

If I take the values on form submit I only get gen.name as value but I need the id of gen object as well.

So what can I do to get its id as well? Please note there are multiple input values as they are inside ng-repeat

share|improve this question
    
movie.genres is an array of objects or just an object? – T J Jul 13 at 10:37
    
Array of objects – Invictus Jul 13 at 10:38
    
Create fiddle or plnkr. – Hardik Vaghani Jul 13 at 10:39
    
You said "movie.genre is an object" in question. Update the question with proper info. Where are you binding the id in your from? – T J Jul 13 at 10:42
    
@TJ I didnot understand your querry. I am sending this id to the database as there are already genres created in the database with some ids . So the form input value name and id gets identified for future refrence. Its like object already have genres can be modified with diffrent genre change. – Invictus Jul 13 at 10:45
up vote 0 down vote

You can use Array.findIndex() to find the id of the object which has the name of the selected genre.

Something like this should work (as long movie.genres is an array and valueFromForm is the value you get from your ng-model):

let index = movie.genres.findIndex(gen => gen.name === valueFromForm);
id = movie.genres[index].id;

This code uses ES6 so it needs recent browsers if you do not transcompile. You can use this other version for older browsers:

var id = -1;
for (var i=0; i < movie.genres.length; i++) {
  if (movie.genres[i].name === valueFromForm) {
    id = movie.genres[i].id;
    break;
  }
}
share|improve this answer
up vote 0 down vote

Here is a working example of exactly what you want. I hope this will help you fix your problem:

angular.module('submitExample', [])
    .controller('ExampleController', ['$scope', '$log', function($scope, $log) {
        $scope.movie = {
        	title: 'Movie Title',
            genres: [{
                name: 'Action'
            }, {
                name: 'Drama'
            }, {
                name: 'Comedy'
            }]
        };
        $scope.submit = function() {
            $log.info($scope.movie);
        };
    }]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.1/angular.min.js"></script>
<div ng-app="submitExample">
    <form ng-submit="submit()" ng-controller="ExampleController">
        <input ng-model="gen.name" ng-repeat="gen in movie.genres"><br>
        <input type="submit" value="Submit">
    </form>
</div>

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.