checkbox, radio: Sync prop to support jQuery form serialization #1768

bem · Mar 31, 2016 · 012de48 · 012de48
1 parent b6d99e3
commit 012de48
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 4 deletions.
diff --git a/common.blocks/checkbox/_type/checkbox_type_button.spec.js b/common.blocks/checkbox/_type/checkbox_type_button.spec.js
@@ -37,6 +37,19 @@ describe('checkbox_type_button', function() {
             button.hasMod('checked').should.be.false;
         });
 
+        it('should set/unset property properly', function() {
+            expect(checkbox.elem('control')[0].checked).to.be.false;
+
+            checkbox.setMod('checked');
+            expect(checkbox.elem('control')[0].checked).to.be.true;
+
+            checkbox.delMod('checked');
+            expect(checkbox.elem('control')[0].checked).to.be.false;
+
+            checkbox.setMod('checked');
+            expect(checkbox.elem('control')[0].checked).to.be.true;
+        });
+
         it('should set/unset aria-attributes properly', function() {
             checkbox.setMod('checked');
             expect(button.domElem.attr('aria-pressed')).to.be.undefined;

diff --git a/common.blocks/checkbox/checkbox.js b/common.blocks/checkbox/checkbox.js
@@ -14,10 +14,14 @@ provide(BEMDOM.decl({ block : this.name, baseBlock : Control }, /** @lends check
     onSetMod : {
         'checked' : {
             'true' : function() {
-                this.elem('control').attr('checked', true);
+                this.elem('control')
+                    .attr('checked', true)
+                    .prop('checked', true);
             },
             '' : function() {
-                this.elem('control').removeAttr('checked');
+                this.elem('control')
+                    .removeAttr('checked')
+                    .prop('checked', false);
             }
         }
     },

diff --git a/common.blocks/radio/_type/radio_type_button.spec.js b/common.blocks/radio/_type/radio_type_button.spec.js
@@ -34,6 +34,19 @@ describe('radio_type_button', function() {
             radio.delMod('checked');
             radio.findBlockInside('button').hasMod('checked').should.be.false;
         });
+
+        it('should set/unset property "checked"', function() {
+            radio.elem('control').prop('checked').should.be.false;
+
+            radio.setMod('checked');
+            radio.elem('control').prop('checked').should.be.true;
+
+            radio.delMod('checked');
+            radio.elem('control').prop('checked').should.be.false;
+
+            radio.setMod('checked');
+            radio.elem('control').prop('checked').should.be.true;
+        });
     });
 
     describe('disabled', function() {

diff --git a/common.blocks/radio/radio.js b/common.blocks/radio/radio.js
@@ -17,10 +17,14 @@ provide(BEMDOM.decl({ block : this.name, baseBlock : Control }, /** @lends radio
     onSetMod : {
         'checked' : {
             'true' : function() {
-                this.elem('control').attr('checked', true);
+                this.elem('control')
+                    .attr('checked', true)
+                    .prop('checked', true);
             },
             '' : function() {
-                this.elem('control').removeAttr('checked');
+                this.elem('control')
+                    .removeAttr('checked')
+                    .prop('checked', false);
             }
         }
     },