I have a strange issue in one of my AngularJS apps. The app uses iCheck for styling checkboxes, and the issue is this: When selecting a checkbox by clicking on its label, while on a mobile phone (or a mobile emulator), the events tied to the checkbox are fired twice.
I've created a JSFiddle where you can reproduce the issue yourself: http://ift.tt/1zvdIsI
<input data-icheck data-ng-model="product.selected" id="{{product.id}}" type="checkbox" data-ng-change="callAnEvent()" />
First, take a look at how it's supposed to work:
- Open the JSFiddle in your browser
- Open the javascript console in your developer toolbar
- Select one of the checkboxes by clicking on the label and you will see three log items in the console log: Apply, Event called and Update
Now, let's reproduce the issue I'm trying to fix:
- Open the JSFiddle in a mobile emulator (try iPhone 6 for example)
- Open the javascript console in your developer toolbar
- Select one of the checkboxes by clicking on the label and you will see five log items in the console log: Apply, Event called, Update, Event called and Update
Screenshots: http://ift.tt/1AlnR0s
As you can see, the events that are logging 'event called' and 'update' to the console are triggered twice when using a mobile. Also, the checkbox is not checked. Is anyone able to figure out why this happens?
Thanks!
Aucun commentaire:
Enregistrer un commentaire