jenkins-bot has submitted this change and it was merged.

Change subject: TextInputWidget: Add methods #setRequired / #isRequired
......................................................................


TextInputWidget: Add methods #setRequired / #isRequired

Previously, the required state could only be set via constructor
config options, and could not be unset later.

Bug: T145440
Change-Id: I860b167ba01ceac09f5a74e4718a82d3d2545823
---
M php/widgets/TextInputWidget.php
M src/widgets/TextInputWidget.js
2 files changed, 77 insertions(+), 17 deletions(-)

Approvals:
  Jforrester: Looks good to me, approved
  jenkins-bot: Verified



diff --git a/php/widgets/TextInputWidget.php b/php/widgets/TextInputWidget.php
index 5eb53c2..59f76f2 100644
--- a/php/widgets/TextInputWidget.php
+++ b/php/widgets/TextInputWidget.php
@@ -26,6 +26,13 @@
        protected $readOnly = false;
 
        /**
+        * Mark as required.
+        *
+        * @var boolean
+        */
+       protected $required = false;
+
+       /**
         * Allow multiple lines of text.
         *
         * @var boolean
@@ -66,11 +73,6 @@
                                $config['icon'] = 'search';
                        }
                }
-               if ( $config['required'] ) {
-                       if ( !array_key_exists( 'indicator', $config ) ) {
-                               $config['indicator'] = 'required';
-                       }
-               }
 
                // Parent constructor
                parent::__construct( $config );
@@ -88,6 +90,7 @@
                        ->addClasses( [ 'oo-ui-textInputWidget', 
'oo-ui-textInputWidget-type-' . $this->type ] )
                        ->appendContent( $this->icon, $this->indicator );
                $this->setReadOnly( $config['readOnly'] );
+               $this->setRequired( $config['required'] );
                if ( isset( $config['placeholder'] ) ) {
                        $this->input->setAttributes( [ 'placeholder' => 
$config['placeholder'] ] );
                }
@@ -96,9 +99,6 @@
                }
                if ( $config['autofocus'] ) {
                        $this->input->setAttributes( [ 'autofocus' => 
'autofocus' ] );
-               }
-               if ( $config['required'] ) {
-                       $this->input->setAttributes( [ 'required' => 
'required', 'aria-required' => 'true' ] );
                }
                if ( !$config['autocomplete'] ) {
                        $this->input->setAttributes( [ 'autocomplete' => 'off' 
] );
@@ -134,6 +134,37 @@
                return $this;
        }
 
+       /**
+        * Check if the widget is required.
+        *
+        * @return boolean
+        */
+       public function isRequired() {
+               return $this->required;
+       }
+
+       /**
+        * Set the required state of the widget.
+        *
+        * @param boolean $state Make input required
+        * @return $this
+        */
+       public function setRequired( $state ) {
+               $this->required = (bool)$state;
+               if ( $this->required ) {
+                       $this->input->setAttributes( [ 'required' => 
'required', 'aria-required' => 'true' ] );
+                       if ( $this->getIndicator() === null ) {
+                               $this->setIndicator( 'required' );
+                       }
+               } else {
+                       $this->input->removeAttributes( [ 'required', 
'aria-required' ] );
+                       if ( $this->getIndicator() === 'required' ) {
+                               $this->setIndicator( null );
+                       }
+               }
+               return $this;
+       }
+
        protected function getInputElement( $config ) {
                if ( isset( $config['multiline'] ) && $config['multiline'] ) {
                        return new Tag( 'textarea' );
diff --git a/src/widgets/TextInputWidget.js b/src/widgets/TextInputWidget.js
index 1b251db..45046c2 100644
--- a/src/widgets/TextInputWidget.js
+++ b/src/widgets/TextInputWidget.js
@@ -67,11 +67,6 @@
                }
                // indicator: 'clear' is set dynamically later, depending on 
value
        }
-       if ( config.required ) {
-               if ( config.indicator === undefined ) {
-                       config.indicator = 'required';
-               }
-       }
 
        // Parent constructor
        OO.ui.TextInputWidget.parent.call( this, config );
@@ -85,6 +80,7 @@
        // Properties
        this.type = this.getSaneType( config );
        this.readOnly = false;
+       this.required = false;
        this.multiline = !!config.multiline;
        this.autosize = !!config.autosize;
        this.minRows = config.rows !== undefined ? config.rows : '';
@@ -128,6 +124,7 @@
                .addClass( 'oo-ui-textInputWidget oo-ui-textInputWidget-type-' 
+ this.type )
                .append( this.$icon, this.$indicator );
        this.setReadOnly( !!config.readOnly );
+       this.setRequired( !!config.required );
        this.updateSearchIndicator();
        if ( config.placeholder !== undefined ) {
                this.$input.attr( 'placeholder', config.placeholder );
@@ -137,10 +134,6 @@
        }
        if ( config.autofocus ) {
                this.$input.attr( 'autofocus', 'autofocus' );
-       }
-       if ( config.required ) {
-               this.$input.attr( 'required', 'required' );
-               this.$input.attr( 'aria-required', 'true' );
        }
        if ( config.autocomplete === false ) {
                this.$input.attr( 'autocomplete', 'off' );
@@ -341,6 +334,42 @@
 };
 
 /**
+ * Check if the input is {@link #required required}.
+ *
+ * @return {boolean}
+ */
+OO.ui.TextInputWidget.prototype.isRequired = function () {
+       return this.required;
+};
+
+/**
+ * Set the {@link #required required} state of the input.
+ *
+ * @param {boolean} state Make input required
+ * @chainable
+ */
+OO.ui.TextInputWidget.prototype.setRequired = function ( state ) {
+       this.required = !!state;
+       if ( this.required ) {
+               this.$input
+                       .attr( 'required', 'required' )
+                       .attr( 'aria-required', 'true' );
+               if ( this.getIndicator() === null ) {
+                       this.setIndicator( 'required' );
+               }
+       } else {
+               this.$input
+                       .removeAttr( 'required' )
+                       .removeAttr( 'aria-required' );
+               if ( this.getIndicator() === 'required' ) {
+                       this.setIndicator( null );
+               }
+       }
+       this.updateSearchIndicator();
+       return this;
+};
+
+/**
  * Support function for making #onElementAttach work across browsers.
  *
  * This whole function could be replaced with one line of code using the 
DOMNodeInsertedIntoDocument

-- 
To view, visit https://gerrit.wikimedia.org/r/311459
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: merged
Gerrit-Change-Id: I860b167ba01ceac09f5a74e4718a82d3d2545823
Gerrit-PatchSet: 1
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: Bartosz DziewoĊ„ski <matma....@gmail.com>
Gerrit-Reviewer: Jforrester <jforres...@wikimedia.org>
Gerrit-Reviewer: jenkins-bot <>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to