Proper format for ng-repeat Checkboxes?

I want to create a form that collects a persons email address and then a dynamic list of check boxes. (The dynamic part will come from a DB query, but for purposes of this question, I am providing a sample scope array.

What I need help with is how to set up the ng-repeat to allow for that dynamic list to be made available as a set of post vals upon submit.  The following is a modified piece of the code for demo purposes.

Here is the key portion of my Angular Code:

$scope.seminars = [
    { id: 1, name: 'Seminar One' },
    { id: 2, name: 'Seminar Two' },
    { id: 3, name: 'Seminar Three' },
    { id: 4, name: 'Seminar Four' }
  ];

$scope.submitFm = function (data) {
	console.log("Arrival at submit for checkboxes");
	console.log(data);
};	

Open in new window


And here is the HTML Code. I am creating a form that the attendee fills out to select which seminars they want to attend.  The first field of the form is email. The second field is a check field that I've created.  The third is my attempt at an ng-repeat to get the list of selected seminars.

<form id="attnFm" name="attnFm" class="form" ng-if="!msg">
       <input type="hidden" ng-model="attn.post_actions" ng-init="attn.post_actions='matm_attend'"/>
       <div class="row">
		 <label class="sr-only" for="email">email</label>
		 <input type="email" class="form-control" id="email"
                                         placeholder=" Email" 
                                         ng-model="attn.email"/>
       </div>
						
	<div class="row">
		<label class="sr-only" for="checky">checky</label>Check Box
		<input type="checkbox" class="form-control" id="checky"
                                         ng-model="attn.checky"/>
         </div>
	<div class="row">
            <div ng-repeat="seminar in seminars"> 
		<label class="sr-only" for="seminar.name">seminar.name</label>
		<input type="checkbox" class="form-control" id="seminar.id" ng-model="seminar.id"/>
          </div>
         <div class="row">
                                	<button type="submit" id="frmsbmt" class="btn btn-primary btn-xl"
                                           ng-disabled="attnFm.$invalid" ng-click="submitFm(attn)">
                                                  View <i class="fa fa-send"></i>
                                    </button>
          </div>
 </form>

Open in new window


The main problem I am having is what to use as the model for my ng-repeat seminar field. If I try ng-model="attn.{{seminar.ID}}" I get an error. When I set it to ng-model="attn.seminar.ID" then all three of the ng-repeat fields are linked and when I click one, all show.  

So what do I set the ng-model= field to get it to work?

When I hit submit and view the console with the developer tools.  Here is what shows on the developer console view:

checky: true
email: "myemail@aol.com"
​post_actions: "matm_attend"
​seminarID: true

So how do I get the checkboxes of ng-repeat to properly show up in my console view log?

NOTE: in order to demonstrate this
Paul KonstanskiProject SpecialistAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Paul KonstanskiProject SpecialistAuthor Commented:
I found the answer...

I just needed to change this:  
<input type="checkbox" class="form-control" id="seminar.id" ng-model="seminar.id"/>

Open in new window



To this:
<input type="checkbox" class="form-control" id="seminar.id" ng-model="seminars[seminar.id]"/>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Julian HansenCommented:
Note that in your case seminars[seminar.id] is identical to seminar

So if you are linking the model to the actual object (rather than the id) then you could do this

<input type="checkbox" class="form-control" id="seminar.id" ng-model="seminar"/>

Open in new window


No need to use the parent array.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.