PHP开发框架Yii Framework教程(40) Zii组件-SliderInput示例

CJuiSliderInput 显示一滑动条，它也封装了 JUI slider插件，可以用在Form中作为用户输入UI组件。

基本用法如 下：

<center class="form">
<?php $form=$this->beginWidget('CActiveForm'); ?>

    <?php echo $form->errorSummary($model); ?>

 <?php $this->widget('zii.widgets.jui.CJuiSliderInput', array(
    'model'=>$model,
    'attribute'=>'size',
    'name'=>'my_slider',
    'value'=>50,
    'event'=>'change',
    'options'=>array(
                'min'=>0,
                'max'=>100,
                'slide'=>'js:function(event,ui){$("#amount").text(ui.value);}',
                ),
            'htmlOptions'=>array(
                'style'=>'width:200px; float:left;'
                ),
 )); ?>

<center id="amount" style="margin-left:215px;">50</center>
    <center class="row submit">
        <?php echo CHtml::submitButton('Submit'); ?>
    </center>

<?php $this->endWidget(); ?>
</center><!-- form -->

用户提交后，使用result.php来显示用户输入的值，这里定义DataModel如下：

class DataModel extends CFormModel
{
    public $size;

    public function rules()
    {
        return array(
            array('size', 'safe'),
        );
    }
}

修改SiteController的indexAction方法：

public function actionIndex()
{

    $model=new DataModel();
    $model->size=50;
    if(!emptyempty($_POST['DataModel']))
    {
        $model->attributes=$_POST['DataModel'];

        if($model->validate())
        {
            $this->render('result', array(
                'model' => $model,

                ));
            return;
        }

    }

    $this->render('index', array(
            'model' => $model,

            ));
}

开发框架Yii Framework教程(40) Zii组件-SliderInput示例-jquery ui slider示例">

查看全套教程：http://www.bianceng.cn/webkf/PHP/201301/35265.htm

本例下载：http://www.imobilebbs.com/download/yii/JuiSliderInputDemo.zip

以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索framework
， 插件
， 封装
， 组件
， 开发框架
示例
jquery ui slider示例、slider组件、vue slider 组件、slider.js滑动条组件、bootstrap slider组件，以便于您获取更多的相关知识。