Input checkbox in <a> with ng-click

Question

I have situtation like this:

<a ng-click="doSomething()">
   Text
   <input type="checkbox"/>
</a>

And if I want to mark the checkbox it does doSomething() instead and checkbox remains unchecked. I know that it is easy to say to just put outside but I really can't do it so don't offer that.

Thanks in advance!

Anton Strogonoff · Accepted Answer · 2016-05-10 17:22:32Z

1

How about:

<a ng-click="doSomething()">
   Text
   <input type="checkbox" ng-checked="boxChecked" />
</a>

Then in your $scope.doSomething() function add an assignment $scope.boxChecked = true.

ngChecked docs

answered May 10, 2016 at 17:22

Anton Strogonoff

34.4k8 gold badges59 silver badges68 bronze badges

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

2 Comments

stackattack Over a year ago

Good answer! Almost solves my problem but in your case the checkbox gets checked also if I click on the Text. Is there a way to check the checkbox only when I click on the checkbox?

Anton Strogonoff Over a year ago

@RVstack oh haha, then how about you do <input type="checkbox" ng-checked="boxChecked" ng-click="checkTheBox()" />, and move that assignment $scope.boxChecked = true from $scope.doSomething() into $scope.checkTheBox()

shershen · Accepted Answer · 2016-05-10 17:22:16Z

0

You can toggle input by follwoing way:

<!--temlate-->
<a ng-click="doSomething()">
   Text
   <input type="checkbox" ng-checked="myModelProperty"/>
</a>

//controller
$scope.doSomething = function(){
  $scope.myModelProperty = !$scope.myModelProperty;
}

answered May 10, 2016 at 17:22

shershen

10k11 gold badges44 silver badges62 bronze badges

Collectives™ on Stack Overflow

Input checkbox in <a> with ng-click

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related