class Range
Provides a slider for input of a number within a specific range.
Provides an HTML5 input element with type of "range".
Properties:
- #min: Minimum value (defaults to 0).
 - #max: Maximum value (defaults to 100).
 
Refer to \Drupal\Core\Render\Element\Number for additional properties.
Usage example:
$form['quantity'] = array(
  '#type' => 'range',
  '#title' => $this->t('Quantity'),
);Plugin annotation
@FormElement("range");
  
  Hierarchy
- class \Drupal\Component\Plugin\PluginBase implements \Drupal\Component\Plugin\PluginInspectionInterface, \Drupal\Component\Plugin\DerivativeInspectionInterface
- class \Drupal\Core\Plugin\PluginBase uses \Drupal\Core\StringTranslation\StringTranslationTrait, \Drupal\Core\DependencyInjection\DependencySerializationTrait, \Drupal\Core\Messenger\MessengerTrait extends \Drupal\Component\Plugin\PluginBase
- class \Drupal\Core\Render\Element\RenderElement implements \Drupal\Core\Render\Element\ElementInterface extends \Drupal\Core\Plugin\PluginBase
- class \Drupal\Core\Render\Element\FormElement implements \Drupal\Core\Render\Element\FormElementInterface extends \Drupal\Core\Render\Element\RenderElement
- class \Drupal\Core\Render\Element\Number extends \Drupal\Core\Render\Element\FormElement
- class \Drupal\Core\Render\Element\Range extends \Drupal\Core\Render\Element\Number
 
 
 - class \Drupal\Core\Render\Element\Number extends \Drupal\Core\Render\Element\FormElement
 
 - class \Drupal\Core\Render\Element\FormElement implements \Drupal\Core\Render\Element\FormElementInterface extends \Drupal\Core\Render\Element\RenderElement
 
 - class \Drupal\Core\Render\Element\RenderElement implements \Drupal\Core\Render\Element\ElementInterface extends \Drupal\Core\Plugin\PluginBase
 
 - class \Drupal\Core\Plugin\PluginBase uses \Drupal\Core\StringTranslation\StringTranslationTrait, \Drupal\Core\DependencyInjection\DependencySerializationTrait, \Drupal\Core\Messenger\MessengerTrait extends \Drupal\Component\Plugin\PluginBase
 
Expanded class hierarchy of Range
See also
\Drupal\Core\Render\Element\Number
7 string references to 'Range'
- ContextDefinitionIsSatisfiedTest::providerTestIsSatisfiedBy in core/
tests/ Drupal/ Tests/ Core/ Plugin/ Context/ ContextDefinitionIsSatisfiedTest.php  - Provides test data for ::testIsSatisfiedBy().
 - field.field.node.page.field_range.yml in core/
modules/ datetime_range/ tests/ fixtures/ update/ field.field.node.page.field_range.yml  - core/modules/datetime_range/tests/fixtures/update/field.field.node.page.field_range.yml
 - FormTestDisabledElementsForm::buildForm in core/
modules/ system/ tests/ modules/ form_test/ src/ Form/ FormTestDisabledElementsForm.php  - Form constructor.
 - form_test.routing.yml in core/
modules/ system/ tests/ modules/ form_test/ form_test.routing.yml  - core/modules/system/tests/modules/form_test/form_test.routing.yml
 - form_test.routing.yml in core/
modules/ system/ tests/ modules/ form_test/ form_test.routing.yml  - core/modules/system/tests/modules/form_test/form_test.routing.yml
 
2 #type uses of Range
- FormTestRangeForm::buildForm in core/
modules/ system/ tests/ modules/ form_test/ src/ Form/ FormTestRangeForm.php  - Form constructor.
 - FormTestRangeInvalidForm::buildForm in core/
modules/ system/ tests/ modules/ form_test/ src/ Form/ FormTestRangeInvalidForm.php  - Form constructor.
 
File
- 
              core/
lib/ Drupal/ Core/ Render/ Element/ Range.php, line 30  
Namespace
Drupal\Core\Render\ElementView source
class Range extends Number {
  
  /**
   * {@inheritdoc}
   */
  public function getInfo() {
    $info = parent::getInfo();
    $class = get_class($this);
    return [
      '#min' => 0,
      '#max' => 100,
      '#pre_render' => [
        [
          $class,
          'preRenderRange',
        ],
      ],
      '#theme' => 'input__range',
    ] + $info;
  }
  
  /**
   * Prepares a #type 'range' render element for input.html.twig.
   *
   * @param array $element
   *   An associative array containing the properties of the element.
   *   Properties used: #title, #value, #description, #min, #max, #attributes,
   *   #step.
   *
   * @return array
   *   The $element with prepared variables ready for input.html.twig.
   */
  public static function preRenderRange($element) {
    $element['#attributes']['type'] = 'range';
    Element::setAttributes($element, [
      'id',
      'name',
      'value',
      'step',
      'min',
      'max',
    ]);
    static::setAttributes($element, [
      'form-range',
    ]);
    return $element;
  }
  
  /**
   * {@inheritdoc}
   */
  public static function valueCallback(&$element, $input, FormStateInterface $form_state) {
    if ($input === '') {
      $offset = ($element['#max'] - $element['#min']) / 2;
      // Round to the step.
      if (strtolower($element['#step']) != 'any') {
        $steps = round($offset / $element['#step']);
        $offset = $element['#step'] * $steps;
      }
      return $element['#min'] + $offset;
    }
  }
}
Members
| Title Sort descending | Modifiers | Object type | Summary | Overriden Title | Overrides | 
|---|---|---|---|---|---|
| DependencySerializationTrait::$_entityStorages | protected | property | An array of entity type IDs keyed by the property name of their storages. | ||
| DependencySerializationTrait::$_serviceIds | protected | property | An array of service IDs keyed by property name used for serialization. | ||
| DependencySerializationTrait::__sleep | public | function | 1 | ||
| DependencySerializationTrait::__wakeup | public | function | 2 | ||
| FormElement::processAutocomplete | public static | function | Adds autocomplete functionality to elements. | ||
| FormElement::processPattern | public static | function | #process callback for #pattern form element property. | ||
| FormElement::validatePattern | public static | function | #element_validate callback for #pattern form element property. | ||
| MessengerTrait::$messenger | protected | property | The messenger. | 29 | |
| MessengerTrait::messenger | public | function | Gets the messenger. | 29 | |
| MessengerTrait::setMessenger | public | function | Sets the messenger. | ||
| Number::preRenderNumber | public static | function | Prepares a #type 'number' render element for input.html.twig. | ||
| Number::validateNumber | public static | function | Form element validation handler for #type 'number'. | ||
| PluginBase::$configuration | protected | property | Configuration information passed into the plugin. | 1 | |
| PluginBase::$pluginDefinition | protected | property | The plugin implementation definition. | 1 | |
| PluginBase::$pluginId | protected | property | The plugin_id. | ||
| PluginBase::DERIVATIVE_SEPARATOR | constant | A string which is used to separate base plugin IDs from the derivative ID. | |||
| PluginBase::getBaseId | public | function | Gets the base_plugin_id of the plugin instance. | Overrides DerivativeInspectionInterface::getBaseId | |
| PluginBase::getDerivativeId | public | function | Gets the derivative_id of the plugin instance. | Overrides DerivativeInspectionInterface::getDerivativeId | |
| PluginBase::getPluginDefinition | public | function | Gets the definition of the plugin implementation. | Overrides PluginInspectionInterface::getPluginDefinition | 3 | 
| PluginBase::getPluginId | public | function | Gets the plugin_id of the plugin instance. | Overrides PluginInspectionInterface::getPluginId | |
| PluginBase::isConfigurable | public | function | Determines if the plugin is configurable. | ||
| PluginBase::__construct | public | function | Constructs a \Drupal\Component\Plugin\PluginBase object. | 78 | |
| Range::getInfo | public | function | Returns the element properties for this element. | Overrides Number::getInfo | |
| Range::preRenderRange | public static | function | Prepares a #type 'range' render element for input.html.twig. | ||
| Range::valueCallback | public static | function | Determines how user input is mapped to an element's #value property. | Overrides FormElement::valueCallback | |
| RenderElement::preRenderAjaxForm | public static | function | Adds Ajax information about an element to communicate with JavaScript. | ||
| RenderElement::preRenderGroup | public static | function | Adds members of this group as actual elements for rendering. | ||
| RenderElement::processAjaxForm | public static | function | Form element processing handler for the #ajax form property. | 1 | |
| RenderElement::processGroup | public static | function | Arranges elements into groups. | ||
| RenderElement::setAttributes | public static | function | Sets a form element's class attribute. | Overrides ElementInterface::setAttributes | |
| StringTranslationTrait::$stringTranslation | protected | property | The string translation service. | 1 | |
| StringTranslationTrait::formatPlural | protected | function | Formats a string containing a count of items. | ||
| StringTranslationTrait::getNumberOfPlurals | protected | function | Returns the number of plurals supported by a given language. | ||
| StringTranslationTrait::getStringTranslation | protected | function | Gets the string translation service. | ||
| StringTranslationTrait::setStringTranslation | public | function | Sets the string translation service to use. | 2 | |
| StringTranslationTrait::t | protected | function | Translates a string to the current language or to a given language. | 
Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.