CJuiSliderInput
| 包 | zii.widgets.jui |
|---|---|
| 继承 | class CJuiSliderInput » CJuiInputWidget » CJuiWidget » CWidget » CBaseController » CComponent |
| 可用自 | 1.1 |
| 源码 | framework/zii/widgets/jui/CJuiSliderInput.php |
CJuiSliderInput displays a slider. It can be used in forms and post its value.
CJuiSlider encapsulates the JUI slider plugin.
To use this widget, you may insert the following code in a view:
The widget can also be used in range mode which uses 2 sliders to set a range. In this mode, attribute and maxAttribute will define the attribute names for the minimum and maximum range values, respectively. For example:
If you need to use the slider event, please change the event value for 'stop' or 'change'.
By configuring the options property, you may specify the options that need to be passed to the JUI slider plugin. Please refer to the JUI Slider API documentation for possible options (name-value pairs) and JUI Slider page for general description and demo.
CJuiSlider encapsulates the JUI slider plugin.
To use this widget, you may insert the following code in a view:
$this->widget('zii.widgets.jui.CJuiSliderInput',array(
'name'=>'rate',
'value'=>37,
// additional javascript options for the slider plugin
'options'=>array(
'min'=>10,
'max'=>50,
),
'htmlOptions'=>array(
'style'=>'height:20px;',
),
));
The widget can also be used in range mode which uses 2 sliders to set a range. In this mode, attribute and maxAttribute will define the attribute names for the minimum and maximum range values, respectively. For example:
$this->widget('zii.widgets.jui.CJuiSliderInput',array(
'model'=>$model,
'attribute'=>'timeMin',
'maxAttribute'=>'timeMax',
// additional javascript options for the slider plugin
'options'=>array(
'range'=>true,
'min'=>0,
'max'=>24,
),
));
If you need to use the slider event, please change the event value for 'stop' or 'change'.
By configuring the options property, you may specify the options that need to be passed to the JUI slider plugin. Please refer to the JUI Slider API documentation for possible options (name-value pairs) and JUI Slider page for general description and demo.
公共属性
| 属性 | 类型 | 描述 | 被定义在 |
|---|---|---|---|
| actionPrefix | string | the prefix to the IDs of the actions. | CWidget |
| attribute | string | the attribute associated with this widget. | CJuiInputWidget |
| controller | CController | Returns the controller that this widget belongs to. | CWidget |
| cssFile | mixed | the theme CSS file name. | CJuiWidget |
| event | string | the name of the event where the input will be attached to the slider. | CJuiSliderInput |
| htmlOptions | array | the HTML attributes that should be rendered in the HTML tag representing the JUI widget. | CJuiWidget |
| id | string | Returns the ID of the widget or generates a new one if requested. | CWidget |
| maxAttribute | string | name of attribute for max value if slider is used in range mode. | CJuiSliderInput |
| maxIdSuffix | string | the suffix to be appended to the ID of the max value input element when slider used in range mode. | CJuiSliderInput |
| maxName | string | the input name to be used for max value attribute when using slider in range mode. | CJuiSliderInput |
| maxValue | integer | determines the max value of the slider, if there's two handles (range mode). | CJuiSliderInput |
| model | CModel | the data model associated with this widget. | CJuiInputWidget |
| name | string | the input name. | CJuiInputWidget |
| options | array | the initial JavaScript options that should be passed to the JUI plugin. | CJuiWidget |
| owner | CBaseController | Returns the owner/creator of this widget. | CWidget |
| scriptFile | mixed | the main JUI JavaScript file. | CJuiWidget |
| scriptUrl | string | the root URL that contains all JUI JavaScript files. | CJuiWidget |
| skin | mixed | the name of the skin to be used by this widget. | CWidget |
| tagName | string | the name of the container element that contains the slider. | CJuiSliderInput |
| theme | string | the JUI theme name. | CJuiWidget |
| themeUrl | string | the root URL that contains all JUI theme folders. | CJuiWidget |
| value | integer | determines the value of the slider, if there's only one handle. | CJuiSliderInput |
| viewPath | string | Returns the directory containing the view files for this widget. | CWidget |
公共方法
| 方法 | 描述 | 被定义在 |
|---|---|---|
| __call() | Calls the named method which is not a class method. | CComponent |
| __construct() | Constructor. | CWidget |
| __get() | Returns a property value, an event handler list or a behavior based on its name. | CComponent |
| __isset() | Checks if a property value is null. | CComponent |
| __set() | Sets value of a component property. | CComponent |
| __unset() | Sets a component property to be null. | CComponent |
| actions() | Returns a list of actions that are used by this widget. | CWidget |
| asa() | Returns the named behavior object. | CComponent |
| attachBehavior() | Attaches a behavior to this component. | CComponent |
| attachBehaviors() | Attaches a list of behaviors to the component. | CComponent |
| attachEventHandler() | Attaches an event handler to an event. | CComponent |
| beginCache() | Begins fragment caching. | CBaseController |
| beginClip() | Begins recording a clip. | CBaseController |
| beginContent() | Begins the rendering of content that is to be decorated by the specified view. | CBaseController |
| beginWidget() | Creates a widget and executes it. | CBaseController |
| canGetProperty() | Determines whether a property can be read. | CComponent |
| canSetProperty() | Determines whether a property can be set. | CComponent |
| createWidget() | Creates a widget and initializes it. | CBaseController |
| detachBehavior() | Detaches a behavior from the component. | CComponent |
| detachBehaviors() | Detaches all behaviors from the component. | CComponent |
| detachEventHandler() | Detaches an existing event handler. | CComponent |
| disableBehavior() | Disables an attached behavior. | CComponent |
| disableBehaviors() | Disables all behaviors attached to this component. | CComponent |
| enableBehavior() | Enables an attached behavior. | CComponent |
| enableBehaviors() | Enables all behaviors attached to this component. | CComponent |
| endCache() | Ends fragment caching. | CBaseController |
| endClip() | Ends recording a clip. | CBaseController |
| endContent() | Ends the rendering of content. | CBaseController |
| endWidget() | Ends the execution of the named widget. | CBaseController |
| evaluateExpression() | Evaluates a PHP expression or callback under the context of this component. | CComponent |
| getController() | Returns the controller that this widget belongs to. | CWidget |
| getEventHandlers() | Returns the list of attached event handlers for an event. | CComponent |
| getId() | Returns the ID of the widget or generates a new one if requested. | CWidget |
| getOwner() | Returns the owner/creator of this widget. | CWidget |
| getViewFile() | Looks for the view script file according to the view name. | CWidget |
| getViewPath() | Returns the directory containing the view files for this widget. | CWidget |
| hasEvent() | Determines whether an event is defined. | CComponent |
| hasEventHandler() | Checks whether the named event has attached handlers. | CComponent |
| hasProperty() | Determines whether a property is defined. | CComponent |
| init() | Initializes the widget. | CJuiWidget |
| raiseEvent() | Raises an event. | CComponent |
| render() | Renders a view. | CWidget |
| renderFile() | Renders a view file. | CBaseController |
| renderInternal() | Renders a view file. | CBaseController |
| run() | Run this widget. | CJuiSliderInput |
| setId() | Sets the ID of the widget. | CWidget |
| widget() | Creates a widget and executes it. | CBaseController |
受保护的方法
| 方法 | 描述 | 被定义在 |
|---|---|---|
| hasModel() | Determines whether this widget is associated with a data model. | CJuiInputWidget |
| registerCoreScripts() | Registers the core script files. | CJuiWidget |
| registerScriptFile() | Registers a JavaScript file under scriptUrl. | CJuiWidget |
| resolveNameID() | Resolves name and ID of the input. Source property of the name and/or source property of the attribute | CJuiInputWidget |
| resolvePackagePath() | Determine the JUI package installation path. | CJuiWidget |
属性详情
event
属性
public string $event;
the name of the event where the input will be attached to the slider. It can be 'slide', 'stop' or 'change'. If you want to use 'slide' event change $event property to 'change'.
maxAttribute
属性
public string $maxAttribute;
name of attribute for max value if slider is used in range mode.
maxIdSuffix
属性
（自版本 v1.1.14 可用）
public string $maxIdSuffix;
the suffix to be appended to the ID of the max value input element when slider used in range mode.
maxName
属性
（自版本 v1.1.14 可用）
public string $maxName;
the input name to be used for max value attribute when using slider in range mode. This must be set in case model isn't used.
maxValue
属性
（自版本 v1.1.14 可用）
public integer $maxValue;
determines the max value of the slider, if there's two handles (range mode). Ignored if there's only one handle.
tagName
属性
public string $tagName;
the name of the container element that contains the slider. Defaults to 'div'.
value
属性
public integer $value;
determines the value of the slider, if there's only one handle. If there is more than one handle, determines the value of the first handle.
方法详情
run()
方法
|
public void run()
|
源码： framework/zii/widgets/jui/CJuiSliderInput.php#109 (显示)
public function run()
{
list($name,$id)=$this->resolveNameID();
if(isset($this->htmlOptions['id']))
$id=$this->htmlOptions['id'];
else
$this->htmlOptions['id']=$id;
$isRange=isset($this->options['range']) && $this->options['range'] &&
$this->options['range']!=='max' && $this->options['range']!=='min';
if($this->hasModel())
{
$attribute=$this->attribute;
if($isRange)
{
$options=$this->htmlOptions;
echo CHtml::activeHiddenField($this->model,$this->attribute,$options);
$options['id'].=$this->maxIdSuffix;
echo CHtml::activeHiddenField($this->model,$this->maxAttribute,$options);
$maxAttribute=$this->maxAttribute;
$this->options['values']=array($this->model->$attribute,$this->model->$maxAttribute);
}
else
{
echo CHtml::activeHiddenField($this->model,$this->attribute,$this->htmlOptions);
$this->options['value']=$this->model->$attribute;
}
}
else
{
if($isRange)
{
list($maxName,$maxId)=$this->resolveNameID('maxName','maxAttribute');
$options=$this->htmlOptions;
echo CHtml::hiddenField($name,$this->value,$options);
$options['id'].=$this->maxIdSuffix;
echo CHtml::hiddenField($maxName,$this->maxValue,$options);
$this->options['values']=array($this->value,$this->maxValue);
}
else
{
echo CHtml::hiddenField($name,$this->value,$this->htmlOptions);
if($this->value!==null)
$this->options['value']=$this->value;
}
}
$idHidden=$this->htmlOptions['id'];
$this->htmlOptions['id']=$idHidden.'_slider';
echo CHtml::tag($this->tagName,$this->htmlOptions,'');
$this->options[$this->event]=$isRange
? new CJavaScriptExpression("function(e,ui){ v=ui.values; jQuery('#{$idHidden}').val(v[0]); jQuery('#{$idHidden}{$this->maxIdSuffix}').val(v[1]); }")
: new CJavaScriptExpression("function(event, ui) { jQuery('#{$idHidden}').val(ui.value); }");
$options=CJavaScript::encode($this->options);
Yii::app()->getClientScript()->registerScript(__CLASS__.'#'.$id,"jQuery('#{$id}_slider').slider($options);");
}
Run this widget. This method registers necessary javascript and renders the needed HTML code.