From b72dbe78430b1338ed3808e1172e9ebf212affaa Mon Sep 17 00:00:00 2001
From: Georgi Kostov <p_e_a@gbg.bg>
Date: Thu, 17 Jul 2014 15:15:06 +0300
Subject: [PATCH] Update the fakeCheckable's state if the source element fires
 "change". This allows the UI to stay in sync even if the INPUT is toggled by
 code outside of the plugin (either by JS or by the browser if the user clicks
 a wrapping LABEL for example)

---
 dev/prettyCheckable.js | 42 +++++++++++++++++++++++++-----------------
 1 file changed, 25 insertions(+), 17 deletions(-)

diff --git a/dev/prettyCheckable.js b/dev/prettyCheckable.js
index f03bede..a9c734a 100644
--- a/dev/prettyCheckable.js
+++ b/dev/prettyCheckable.js
@@ -77,21 +77,13 @@
                 ko.utils.triggerEvent(input[0], 'click');
 
             } else {
-
-                if (input.prop('checked')) {
-
-                    input.prop('checked', false).change();
-
-                } else {
-
-                    input.prop('checked', true).change();
-
-                }
+            	
+            	input.prop('checked', !input.prop('checked'));
+            	
+                input.change();
 
             }
 
-            fakeCheckable.toggleClass('checked');
-
         });
 
         element.find('a:first').on('keyup', function(e){
@@ -104,6 +96,12 @@
 
         });
 
+        element.find('input').on('change.'+pluginName, function(e){	// add pluginName namespace for the event so it's easier to remove
+
+       		$(this).data( dataPlugin ).updateChecked();
+
+        });
+
     };
 
     var Plugin = function ( element ) {
@@ -182,9 +180,10 @@
 
         },
 
-        check: function () {
-
-            if ($(this.element).prop('type') === 'radio') {
+        updateChecked: function () {
+        	var checked=$(this.element).prop('checked');
+ 
+             if ($(this.element).prop('type') === 'radio') {
 
                 $('input[name="' + $(this.element).attr('name') + '"]').each(function(index, el){
 
@@ -194,13 +193,22 @@
 
             }
 
-            $(this.element).prop('checked', true).attr('checked', true).parent().find('a:first').addClass('checked');
+            $(this.element).parent().find('a:first')[checked?'addClass':'removeClass']('checked');
+        },
+
+        check: function () {
+        	
+        	$(this.element).prop('checked', true);
+        	
+        	this.updateChecked();
 
         },
 
         uncheck: function () {
 
-            $(this.element).prop('checked', false).attr('checked', false).parent().find('a:first').removeClass('checked');
+        	$(this.element).prop('checked', false);
+        	
+        	this.updateChecked();
 
         },