From 1314747ceb358e910d005b97dfbc32fdfc882035 Mon Sep 17 00:00:00 2001 From: Anton Date: Mon, 15 Nov 2021 21:01:02 +0300 Subject: [PATCH 01/10] ActiveField: add rangeInput(), colorInput() and append switch mode to checkbox() --- src/ActiveField.php | 60 +++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 58 insertions(+), 2 deletions(-) diff --git a/src/ActiveField.php b/src/ActiveField.php index 9dd1811..b78693a 100644 --- a/src/ActiveField.php +++ b/src/ActiveField.php @@ -166,6 +166,10 @@ class ActiveField extends \yii\widgets\ActiveField * @var string the template for checkboxes in default layout */ public $checkTemplate = "
\n{input}\n{label}\n{error}\n{hint}\n
"; + /** + * @var string the template forswitches (custom checkboxes) in default layout + */ + public $switchTemplate = "
\n{input}\n{label}\n{error}\n{hint}\n
"; /** * @var string the template for radios in default layout * @since 2.0.5 @@ -175,6 +179,10 @@ class ActiveField extends \yii\widgets\ActiveField * @var string the template for checkboxes and radios in horizontal layout */ public $checkHorizontalTemplate = "{beginWrapper}\n
\n{input}\n{label}\n{error}\n{hint}\n
\n{endWrapper}"; + /** + * @var string the template for switches (custom checkboxes) in horizontal layout + */ + public $switchHorizontalTemplate = "{beginWrapper}\n
\n{input}\n{label}\n{error}\n{hint}\n
\n{endWrapper}"; /** * @var string the template for checkboxes and radios in horizontal layout * @since 2.0.5 @@ -184,6 +192,10 @@ class ActiveField extends \yii\widgets\ActiveField * @var string the `enclosed by label` template for checkboxes and radios in default layout */ public $checkEnclosedTemplate = "
\n{beginLabel}\n{input}\n{labelTitle}\n{endLabel}\n{error}\n{hint}\n
"; + /** + * @var string tthe `enclosed by label` template for switches(custom checkboxes) in default layout + */ + public $switchEnclosedTemplate = "
\n{beginLabel}\n{input}\n{labelTitle}\n{endLabel}\n{error}\n{hint}\n
"; /** * @var bool whether to render the error. Default is `true` except for layout `inline`. */ @@ -245,6 +257,8 @@ class ActiveField extends \yii\widgets\ActiveField /** * {@inheritdoc} + * Enable option `switch` to render as toggle switch. + * @see https://getbootstrap.com/docs/5.1/forms/checks-radios/#switches */ public function checkbox($options = [], $enclosedByLabel = false) { @@ -256,14 +270,21 @@ class ActiveField extends \yii\widgets\ActiveField $this->labelOptions = ArrayHelper::merge($this->labelOptions, $labelOptions); $this->wrapperOptions = ArrayHelper::merge($this->wrapperOptions, $wrapperOptions); + if (!empty($options['switch'])) { + $this->addRoleAttributes($options, 'switch'); + } if (!isset($options['template'])) { - $this->template = ($enclosedByLabel) ? $this->checkEnclosedTemplate : $this->checkTemplate; + if (empty($options['switch'])) { + $this->template = $enclosedByLabel ? $this->checkEnclosedTemplate : $this->checkTemplate; + } else { + $this->template = $enclosedByLabel ? $this->switchEnclosedTemplate : $this->switchTemplate; + } } else { $this->template = $options['template']; } if ($this->form->layout === ActiveForm::LAYOUT_HORIZONTAL) { if (!isset($options['template'])) { - $this->template = $this->checkHorizontalTemplate; + $this->template = empty($options['switch']) ? $this->checkHorizontalTemplate : $this->switchHorizontalTemplate; } Html::removeCssClass($this->labelOptions, $this->horizontalCssClasses['label']); Html::addCssClass($this->wrapperOptions, $this->horizontalCssClasses['offset']); @@ -482,6 +503,41 @@ class ActiveField extends \yii\widgets\ActiveField return parent::fileInput($options); } + /** + * Renders a range (custom input). + * + * @param array $options the tag options in terms of name-value pairs: + * + * - 'min': min. value + * - 'max': max. value + * - 'step': range step, by default, 1 + * + * @return $this + * @see https://getbootstrap.com/docs/5.1/forms/range/ + */ + public function rangeInput(array $options = []) + { + Html::removeCssClass($options, 'form-control'); + Html::addCssClass($options, ['widget' => 'form-range']); + + return $this->input('range', $options); + } + + /** + * Renders a color picker (custom input). + * + * @param array $options the tag options in terms of name-value pairs + * @return $this + * @see https://getbootstrap.com/docs/5.1/forms/form-control/#color + */ + public function colorInput(array $options = []) + { + Html::removeCssClass($options, 'form-control'); + Html::addCssClass($options, ['widget' => 'form-control form-control-color']); + + return $this->input('color', $options); + } + /** * @param array $instanceConfig the configuration passed to this instance's constructor * @return array the layout specific default configuration for this instance From 8385853b233f64b4f12f1970e249ab2cd4a2e3ab Mon Sep 17 00:00:00 2001 From: Anton Date: Thu, 18 Nov 2021 05:15:07 +0300 Subject: [PATCH 02/10] Update ActiveFieldTest.php --- tests/ActiveFieldTest.php | 47 ++++++++++++++++++++++++++++----------- 1 file changed, 34 insertions(+), 13 deletions(-) diff --git a/tests/ActiveFieldTest.php b/tests/ActiveFieldTest.php index 71ed873..05d1cf7 100644 --- a/tests/ActiveFieldTest.php +++ b/tests/ActiveFieldTest.php @@ -28,7 +28,6 @@ class ActiveFieldTest extends TestCase public function testFileInput() { - Html::$counter = 0; $html = $this->activeField->fileInput()->render(); $expectedHtml = <<Attribute Name +
+ +HTML; + + $this->assertEqualsWithoutLE($expectedHtml, $html); + } + + public function testRangeInput() + { + $html = $this->activeField->rangeInput()->render(); + + $expectedHtml = << + + + +
+ +HTML; + + $this->assertEqualsWithoutLE($expectedHtml, $html); + } + + public function testColorInput() + { + $html = $this->activeField->colorInput()->render(); + + $expectedHtml = << + + +
HTML; @@ -45,7 +76,6 @@ HTML; public function testRadioList() { - Html::$counter = 0; $html = $this->activeField->radioList([1 => 'name1', 2 => 'name2'])->render(); $expectedHtml = <<helperModel->addError($this->attributeName, 'Test print error message'); $html = $this->activeField->radio()->render(); @@ -91,7 +120,6 @@ HTML; public function testRadioListError() { - Html::$counter = 0; $this->helperModel->addError($this->attributeName, 'Test print error message'); $html = $this->activeField->radioList([1 => 'name1', 2 => 'name2'])->render(); @@ -117,7 +145,6 @@ HTML; public function testCheckboxList() { - Html::$counter = 0; $html = $this->activeField->checkboxList([1 => 'name1', 2 => 'name2'])->render(); $expectedHtml = <<helperModel->addError($this->attributeName, 'Test print error message'); $html = $this->activeField->checkbox()->render(); @@ -161,7 +187,6 @@ HTML; public function testCheckboxListError() { - Html::$counter = 0; $this->helperModel->addError($this->attributeName, 'Test print error message'); $html = $this->activeField->checkboxList([1 => 'name1', 2 => 'name2'])->render(); @@ -187,7 +212,6 @@ HTML; public function testRadioListInline() { - Html::$counter = 0; $this->activeField->inline = true; $html = $this->activeField->radioList([1 => 'name1', 2 => 'name2'])->render(); @@ -213,7 +237,6 @@ HTML; public function testCheckboxListInline() { - Html::$counter = 0; $this->activeField->inline = true; $html = $this->activeField->checkboxList([1 => 'name1', 2 => 'name2'])->render(); @@ -238,12 +261,10 @@ HTML; } /** - * * @see https://github.com/yiisoft/yii2-bootstrap/issues/81 */ public function testRadioListItemOptions() { - Html::$counter = 0; $content = $this->activeField->radioList([1 => 'name1', 2 => 'name2'], [ 'itemOptions' => [ 'data-attribute' => 'test' @@ -259,7 +280,6 @@ HTML; */ public function testCheckboxListItemOptions() { - Html::$counter = 0; $content = $this->activeField->checkboxList([1 => 'name1', 2 => 'name2'], [ 'itemOptions' => [ 'data-attribute' => 'test' @@ -274,9 +294,10 @@ HTML; // dirty way to have Request object not throwing exception when running testHomeLinkNull() $_SERVER['SCRIPT_FILENAME'] = "index.php"; $_SERVER['SCRIPT_NAME'] = "index.php"; - parent::setUp(); + Html::$counter = 0; + $this->helperModel = new DynamicModel(['attributeName']); ob_start(); $this->helperForm = ActiveForm::begin(['action' => '/something']); From f69779386a0588557f5282c0df3489ced4ed9a0d Mon Sep 17 00:00:00 2001 From: Anton Date: Thu, 18 Nov 2021 05:19:08 +0300 Subject: [PATCH 03/10] Update CHANGELOG.md --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index f1b1203..45747d7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,7 +4,7 @@ Yii Framework 2 bootstrap5 extension Change Log 2.0.3 under development ----------------------- -- no changes in this release. +- Enh #18: Add rangeInput(), colorInput() and switch mode to checkbox() in class ActiveField (WinterSilence) 2.0.2 October 21, 2021 From f46bdf72f302c7458ed0eb55cff09d4422327abd Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 24 Nov 2021 13:18:52 +0300 Subject: [PATCH 04/10] Update ActiveFieldTest.php --- tests/ActiveFieldTest.php | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/tests/ActiveFieldTest.php b/tests/ActiveFieldTest.php index 05d1cf7..231e262 100644 --- a/tests/ActiveFieldTest.php +++ b/tests/ActiveFieldTest.php @@ -162,6 +162,24 @@ HTML; + +HTML; + $this->assertEqualsWithoutLE($expectedHtml, $html); + } + + /** + * @test checkbox + */ + public function testCheckboxSwitch() + { + $html = $this->activeField->checkbox(['switch' => true])->render(); + + $expectedHtml = << +
+ + +
HTML; $this->assertEqualsWithoutLE($expectedHtml, $html); From 2d87e3a45cc22e8e5f0ff220ce2ec24f03d89335 Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 24 Nov 2021 13:23:24 +0300 Subject: [PATCH 05/10] Update ActiveFieldTest.php --- tests/ActiveFieldTest.php | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/tests/ActiveFieldTest.php b/tests/ActiveFieldTest.php index 231e262..6412a50 100644 --- a/tests/ActiveFieldTest.php +++ b/tests/ActiveFieldTest.php @@ -49,7 +49,7 @@ HTML; $expectedHtml = << - +
@@ -65,7 +65,7 @@ HTML; $expectedHtml = << - +
@@ -180,6 +180,8 @@ HTML; + +
HTML; $this->assertEqualsWithoutLE($expectedHtml, $html); From e198618f82ff92f57e17feda417d0a7ac37f634a Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 24 Nov 2021 13:31:18 +0300 Subject: [PATCH 06/10] Update ActiveField.php --- src/ActiveField.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ActiveField.php b/src/ActiveField.php index b78693a..3718087 100644 --- a/src/ActiveField.php +++ b/src/ActiveField.php @@ -290,7 +290,7 @@ class ActiveField extends \yii\widgets\ActiveField Html::addCssClass($this->wrapperOptions, $this->horizontalCssClasses['offset']); } Html::removeCssClass($this->labelOptions, 'form-label'); - unset($options['template']); + unset($options['template'], $options['switch']); if ($enclosedByLabel) { if (isset($options['label'])) { From b784bfadfee2166e7bcec080b31d49cbef28c5d6 Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 24 Nov 2021 13:36:45 +0300 Subject: [PATCH 07/10] Update ActiveFieldTest.php --- tests/ActiveFieldTest.php | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/tests/ActiveFieldTest.php b/tests/ActiveFieldTest.php index 6412a50..667182f 100644 --- a/tests/ActiveFieldTest.php +++ b/tests/ActiveFieldTest.php @@ -177,11 +177,11 @@ HTML; $expectedHtml = <<
- + -
-
+ + HTML; $this->assertEqualsWithoutLE($expectedHtml, $html); From c35ad7ba427a989e1aab3f0ba1f74a627ddd99e6 Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 24 Nov 2021 13:39:15 +0300 Subject: [PATCH 08/10] Update ActiveFieldTest.php --- tests/ActiveFieldTest.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/ActiveFieldTest.php b/tests/ActiveFieldTest.php index 667182f..6d82135 100644 --- a/tests/ActiveFieldTest.php +++ b/tests/ActiveFieldTest.php @@ -177,7 +177,7 @@ HTML; $expectedHtml = <<
- +
From 1e7013c360787baf11bf8d17720764957f323243 Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 24 Nov 2021 16:32:15 +0300 Subject: [PATCH 09/10] Update usage-widgets.md --- docs/guide/usage-widgets.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/docs/guide/usage-widgets.md b/docs/guide/usage-widgets.md index 026554d..a199147 100644 --- a/docs/guide/usage-widgets.md +++ b/docs/guide/usage-widgets.md @@ -26,6 +26,11 @@ framework features. All widgets belong to `\yii\bootstrap5` namespace: - [[yii\bootstrap5\Toast|Toast]] - [[yii\bootstrap5\ToggleButtonGroup|ToggleButtonGroup]] +## ActiveField: additional fields + +- [Range](https://getbootstrap.com/docs/5.1/forms/range/): `$form->rangeInput(['min' => 0, 'max' => 100, 'step' => 1])` +- [Color picker](https://getbootstrap.com/docs/5.1/forms/form-control/#color): `$form->colorInput()` +- [Switch](https://getbootstrap.com/docs/5.1/forms/checks-radios/#switches): `$form->checkbox(['switch' => true])` ## Customizing widget CSS classes From 6eff0f80ba367a3e1b00c89aaae2d38d924bedba Mon Sep 17 00:00:00 2001 From: simialbi Date: Thu, 25 Nov 2021 10:18:23 +0100 Subject: [PATCH 10/10] Simplified switch and check for boolean --- src/ActiveField.php | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/src/ActiveField.php b/src/ActiveField.php index 3718087..22e5036 100644 --- a/src/ActiveField.php +++ b/src/ActiveField.php @@ -269,22 +269,25 @@ class ActiveField extends \yii\widgets\ActiveField Html::removeCssClass($options, 'form-control'); $this->labelOptions = ArrayHelper::merge($this->labelOptions, $labelOptions); $this->wrapperOptions = ArrayHelper::merge($this->wrapperOptions, $wrapperOptions); + $switch = isset($options['switch']) && $options['switch']; - if (!empty($options['switch'])) { + if ($switch) { $this->addRoleAttributes($options, 'switch'); } if (!isset($options['template'])) { - if (empty($options['switch'])) { - $this->template = $enclosedByLabel ? $this->checkEnclosedTemplate : $this->checkTemplate; - } else { + if ($switch) { $this->template = $enclosedByLabel ? $this->switchEnclosedTemplate : $this->switchTemplate; + } else { + $this->template = $enclosedByLabel ? $this->checkEnclosedTemplate : $this->checkTemplate; } } else { $this->template = $options['template']; } if ($this->form->layout === ActiveForm::LAYOUT_HORIZONTAL) { if (!isset($options['template'])) { - $this->template = empty($options['switch']) ? $this->checkHorizontalTemplate : $this->switchHorizontalTemplate; + $this->template = ($switch) + ? $this->switchHorizontalTemplate + : $this->checkHorizontalTemplate; } Html::removeCssClass($this->labelOptions, $this->horizontalCssClasses['label']); Html::addCssClass($this->wrapperOptions, $this->horizontalCssClasses['offset']);