janneklouman/silverstripe-spinner-field

使用jQuery UI的Spinner Widget的SilverStripe自旋字段。

安装: 703

依赖: 0

建议: 0

安全: 0

星标: 0

关注者: 2

分支: 2

类型:silverstripe-module

v1.1.3 2016-07-18 20:41 UTC

This package is not auto-updated.

Last update: 2024-09-16 21:20:52 UTC


README

使用jQuery UI的Spinner Widget为SilverStripe提供的自旋字段,提供美观的数字输入字段界面和自定义功能。

要求

"require": {
    "php": "^5.4",
    "silverstripe/framework": "~3.1"
}

安装

composer require jjjjjjjjjjjjjjjjjjjj/silverstripe-spinner-field

示例用法

SpinnerField::create(

    // Field name
    'Answer',

    // Label
    'What is the answer to the ultimate question of life, the universe, and everything?',

    // Initial value
    rand(0, 42),

    // Optional options (see available options below under heading: UI settings)
    [
        'min'  => 0,
        'max'  => 42,
        'step' => 3 // Increment and decrement in steps of 3
    ]

);

配置

UI设置

您可以通过构造函数中传递的选项数组来配置自旋小部件的UI,如下所示 以上,或者您可以这样做

// Setting a batch of options.
$spinnerField->setUIOptions(
    [
        'disabled'  => true,
        'max'       => 314159265359,
        'page'      => 100000000000,
        'icon_up'   => 'ui-icon-plus',
        'icon_down' => 'ui-icon-minus'
    ]
);

// On second thought...
$spinnerField->setUIOption('disabled', false);

以下是可用的UI选项列表。有关选项的详细描述和它们的作用,请参阅https://jqueryui-api.jqueryjs.cn/spinner/

// Available options and their default values
[
    culture      => null,
    disabled     => false,
    icon_down    => 'ui-icon-triangle-1-s',
    icon_up      => 'ui-icon-triangle-1-n',
    incremental  => true,
    max          => null,
    min          => null,
    numberFormat => null, // Currently only 'n'||null is supported
    page         => 10,
    step         => 1
]

字段设置

/**
 * Enforce step validation. Will cause validation to fail if input is
 * not evenly divisible with the 'step' UI option. Example: if 'step'
 * is set to 4, validation will fail for 0 !== $input % 4
 *
 * @var bool
 */
protected $enforceStepValidation = false;
/**
 * Will cause validation to fail if input is below the 'min' UI option.
 *
 * @var bool
 */
protected $enforceBelowMinValidation = true;
/**
 * Will cause validation to fail if input is above the 'max' UI option.
 *
 * @var bool
 */
protected $enforceAboveMaxValidation = true;

此外,请参阅NumericField了解继承的字段设置。