Bugfix for setting radio elements as checked/default (#48)

* Fix for radio inputs with value "0"
* Docs

Co-authored-by: Pascal Baljet <[email protected]>

Author: pascalbaljet

CHANGELOG.md

@@ -2,6 +2,18 @@
 
 All notable changes to `laravel-form-components` will be documented in this file
 
+## 2.5.3 - 2020-02-11
+
+- Bugfix for setting radio elements as checked/default
+
+## 2.5.2 - 2020-01-04
+
+- Generate ID by name *and* value (checkbox and radio elements only)
+
+## 2.5.1 - 2020-12-22
+
+- Use the `name` attribute to auto-generate an ID (if not set)
+
 ## 2.5.0 - 2020-12-22
 
 - Support for `BelongsToMany`, `MorphMany`, and `MorphToMany` relationships (select element)

README.md

@@ -321,8 +321,17 @@ You can group checkbox and radio elements on the same horizontal row by adding a
 
 ```blade
 <x-form-group name="notification_channel" label="How do you want to receive your notifications?" inline>
-    <x-form-checkbox name="notification_channel" value="mail" label="Mail" />
-    <x-form-checkbox name="notification_channel" value="slack" label="Slack" />
+    <x-form-radio name="notification_channel" value="mail" label="Mail" />
+    <x-form-radio name="notification_channel" value="slack" label="Slack" />
+</x-form-group>
+```
+
+When you're not using target binding, you can use the `default` attribute the mark a radio element as checked:
+
+```blade
+<x-form-group name="notification_channel" label="How do you want to receive your notifications?">
+    <x-form-radio name="notification_channel" value="mail" label="Mail" default />
+    <x-form-radio name="notification_channel" value="slack" label="Slack" />
 </x-form-group>
 ```
 

src/Components/FormRadio.php

@@ -32,7 +32,11 @@ public function __construct(
         if (!session()->hasOldInput() && $this->isNotWired()) {
             $boundValue = $this->getBoundValue($bind, $name);
 
-            $this->checked = (is_null($boundValue) ? $default : $boundValue) == $this->value;
+            if (!is_null($boundValue)) {
+                $this->checked = $boundValue == $this->value;
+            } else {
+                $this->checked = $default;
+            }
         }
     }
 

tests/Feature/RadioTest.php

@@ -13,6 +13,16 @@ public function it_check_the_right_element_as_default()
         $this->registerTestRoute('default-radio');
 
         $this->visit('/default-radio')
+            ->seeElement('input[value="1"]:checked')
+            ->seeElement('input[value="0"]:not(:checked)');
+    }
+
+    /** @test */
+    public function it_check_the_right_element_as_default_with_a_bound_target()
+    {
+        $this->registerTestRoute('default-radio-bind');
+
+        $this->visit('/default-radio-bind')
             ->seeElement('input[value="a"]:checked')
             ->seeElement('input[value="b"]:not(:checked)');
     }

tests/Feature/views/default-radio-bind.blade.php

@@ -0,0 +1,17 @@
+@php
+$target = ['radio' => 'a'];
+@endphp
+
+<x-form>
+    @bind($target)
+    <x-form-group>
+        <x-form-radio name="radio" value="a" />
+    </x-form-group>
+
+    <x-form-group>
+        <x-form-radio name="radio" value="b" />
+    </x-form-group>
+    @endbind
+
+    <x-form-submit />
+</x-form>

tests/Feature/views/default-radio.blade.php

@@ -3,15 +3,13 @@
 @endphp
 
 <x-form>
-    @bind($target)
     <x-form-group>
-        <x-form-radio name="radio" value="a" />
+        <x-form-radio name="radio" value="1" default />
     </x-form-group>
 
     <x-form-group>
-        <x-form-radio name="radio" value="b" />
+        <x-form-radio name="radio" value="0" />
     </x-form-group>
-    @endbind
 
     <x-form-submit />
 </x-form>