README

yii2-widget-rangeinput

RangeInput 小部件是基于 HTML5 范围输入的定制范围滑块控件。该小部件通过以下功能增强了默认的 HTML 范围输入：

• 专为 Bootstrap 3.x 和 Bootstrap 4.x 设计，具有可定制的标题，显示控件输出。
• 能够添加前缀和后缀（非常有用，用于显示最小和最大范围以及滑块测量单位）。
• 允许通过控件或文本框更改输入。
• 在不支持 Internet Explorer 版本的浏览器中自动降级为正常文本输入。

注意：此扩展是自 2014 年 11 月 8 日起从 yii2-widgets 分离出的子存储库。分离是为了允许开发者在需要时单独安装此特定小部件。也可以使用扩展的先前方式与 yii2-widgets 整套一起使用。

安装

安装此扩展的首选方式是通过 composer。检查此扩展的 composer.json 文件以了解此扩展的需求和依赖关系。阅读此 web 提示 /wiki 了解如何设置应用程序的 composer.json 中的 minimum-stability 设置。

要安装，请运行以下命令之一：

$ php composer.phar require kartik-v/yii2-widget-rangeinput "*"

或添加以下内容到您的 composer.json 文件的 require 部分：

"kartik-v/yii2-widget-rangeinput": "*"

发布更改

有关各种版本和更改的详细信息，请参阅 更改日志。

演示

您可以在以下位置找到有关扩展使用的详细 文档和演示。

使用方法

use kartik\range\RangeInput;

// Usage with rangeinput and model
echo $form->field($model, 'rating')->widget(RangeInput::classname(), [
    'options' => ['placeholder' => 'Select range ...'],
    'html5Options' => ['min'=>0, 'max'=>1, 'step'=>1],
    'html5Container' => ['style' => 'width:350px'],
    'addon' => ['append'=>['content'=>'star']],
    
]);

// With model & without rangeinput
echo '<label class="control-label">Adjust Contrast</label>';
echo RangeInput::widget([
    'model' => $model,
    'attribute' => 'contrast',
    'html5Container' => ['style' => 'width:350px'],
    'addon' => ['append'=>['content'=>'%']],
]);

// Vertical orientation
echo '<label class="control-label">Adjust Contrast</label>';
echo RangeInput::widget([
    'name' => 'slider',
    'value' => 70,
    'orientation' => 'vertical',
    'html5Container' => ['style' => 'width:350px'],
]);

许可

yii2-widget-rangeinput 在 BSD 3-Clause 许可证下发布。有关详细信息，请参阅捆绑的 LICENSE.md 文件。