checkbox limitation with ng-model in angularjs

Question

so far I've only seen people used ng-model to bind the state of checkbox. How can I know which checkbox is checked with angularjs? for example I want to get the index of the checked checkedbox so that I can do something on the backend.

If it were in jquery / js I can use function to catch the state of the checkbox and send the index or etc info to be send back to database.

my plunker : http://plnkr.co/edit/dG9cwswiVzLdjEnpSNvu?p=preview

It looks like you have used properly. what you exactly want to do? — Jay Shukla
– Jay Shukla, Commented Apr 4, 2014 at 10:17
If checkbox is checked item.done will be true, Is it not good enough? — Satpal
– Satpal, Commented Apr 4, 2014 at 10:18
@JayShukla it's just some css, what if I want to run some function? for example grab the name of the checked checkbox? I need those data to be passed to the backend. — user3398172
– user3398172, Commented Apr 4, 2014 at 10:18

paul · Accepted Answer · 2014-04-04 10:25:02Z

1

You could use ng-click, like this:

http://plnkr.co/edit/kOTtbSHbw1kaGWmjqQbf?p=preview

answered Apr 4, 2014 at 10:25

paul

22.1k1 gold badge56 silver badges54 bronze badges

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

5 Comments

user3398172 Over a year ago

lol this is so simple, thx.. I thought of passing param with ng-model which is stupid

user3398172 Over a year ago

can I pass multiple param? like ng-click="boxChecked({{groupId}},$index)"

Jay Shukla Over a year ago

Yes you can. I misunderstood your problem. :)

paul Over a year ago

you don't need the {{ }}, so just try but ng-click="boxChecked(groupId,$index)

user3398172 Over a year ago

actually it's like this : item.groupId , that's why I put {{}}

Jay Shukla · Accepted Answer · 2014-04-04 10:45:50Z

1

I am not clear about your problem but if you want label which associate with checkbox then you should use ng-init.

<div ng-controller="main">
    <div class="checkbox" ng-repeat="item in items">
         <input type="checkbox" id="{{$index}}" ng-model="item.done"><label for="{{$index}}" class="done-{{item.done}}" ng-init="item.text='Label for' + item.val">Label for {{item.val}}</label>
    </div>
    {{items}}
</div>

See Demo

edited Apr 4, 2014 at 10:45

answered Apr 4, 2014 at 10:30

Jay Shukla

5,8368 gold badges35 silver badges65 bronze badges

1 Comment

user3398172 Over a year ago

thanks for pointing out that Jay. how to pass multiple param like this ng-click="boxChecked({{groupId}},$index)" ??

Collectives™ on Stack Overflow

checkbox limitation with ng-model in angularjs

2 Answers 2

5 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related