kam
kam

Reputation: 425

Unable to check/uncheck checkbox when inside Bootstrap dropdown

I'm using bootstrap dropdown along with ng-repeat to produce a list but I'm unable to check or uncheck the checkbox inside the div with data-toggle='dropdown'.

Checkbox works, when I remove data-toggle='dropdown'.

 <div class="dropdown" ng-repeat="item in someArray">
     <div class="dropdown-toggle main-title" data-toggle="dropdown">
     <input type="checkbox"/>
     {{item}}
    <span class="caret"></span>
 </div>

Upvotes: 0

Views: 452

Answers (1)

Eliut Islas
Eliut Islas

Reputation: 608

The data-toggle is capturing the click and stopping propagation to the checkbox.

Move the input before to the div with data-toggle and it will work fine.

<div class="dropdown" ng-repeat="item in someArray">
    <input type="checkbox"/>
    <div class="dropdown-toggle main-title" data-toggle="dropdown">
        item: {{item}}
        <span class="caret"></span>
    </div>
</div>

Upvotes: 1

Related Questions