angular js checkbox current state

Question

Following is my code for checkbox and directive.

When user click on checkbox i wants to know the current state of checkbox. It is not working now

<input type="checkbox" name="fromExistingOffer" ng-model="formData.fromExistingOffer" toggle-existing-offer>


appModule.directive('toggleExistingOffer', function() {
      return function(scope, element) {
        element.bind('click', function() {
            alert(element.attr('checked')); // help needed here

        });
      };
    });

as far as you not creating isolated scope for your directive, shouldn't model be available via scope.formData.fromExistingOffer ? — Rasalom
– Rasalom, Commented Dec 16, 2014 at 15:23
why do you want that custom directive? Why don't you just use ng-change instead? — Josep
– Josep, Commented Dec 16, 2014 at 15:31
Your custom directive is registering a click event on the checkbox in order to check if the checkbox is checked or not. Why in the world would you want to create a directive like that? Why don't you just use either ng-click or ng-change. Then if you wan to know if the checkbox is checked just use the model: formData.fromExistingOffer. — Josep
– Josep, Commented Dec 16, 2014 at 15:42

mrberggg · Accepted Answer · 2014-12-16 15:27:45Z

1

You already have access to the scope in your directive, I would just use that.

element.bind('click', function(){
  alert(scope.formData.fromExistingOffer);
}

answered Dec 16, 2014 at 15:27

mrberggg

5761 gold badge7 silver badges13 bronze badges

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

Comments

MarcoS · Accepted Answer · 2014-12-16 15:42:04Z

0

You miss a scope.$apply()... See also this working fiddle...

<input type="checkbox" name="fromExistingOffer" ng-model="formData.fromExistingOffer" toggle-existing-offer>

appModule.directive('toggleExistingOffer', function() {
  return function(scope, element) {
    element.bind('click', function() {
      scope.$apply(function () { // help given here :-)
        alert(element.attr('checked'));
      });
    });
  };
});

UPDATE: sorry, fiddle was wrong, just updated it right now... :-)

edited Dec 16, 2014 at 15:42

answered Dec 16, 2014 at 15:26

MarcoS

17.8k27 gold badges101 silver badges189 bronze badges

Comments

d-man · Accepted Answer · 2014-12-16 15:43:30Z

0

i tried this and worked awesome thanks "mrberggg"

appModule.directive('toggleExistingOffer', function() {
      return function(scope, element) {
        element.bind('change', function() {
            alert(scope.formData.fromExistingOffer);

        });
      };
    });

answered Dec 16, 2014 at 15:43

d-man

58.2k86 gold badges217 silver badges299 bronze badges

Collectives™ on Stack Overflow

angular js checkbox current state

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related