Yiiframework范围滑块输入

时间:2013-11-22 13:11:50

标签: php jquery yii yii-extensions yii-components

我有一个用户设置页面,用户可以在其中更改应用程序的设置。用户可以输入0到10之间的数字。请参见屏幕截图:http://oi43.tinypic.com/2uerazp.jpg

现在我想使用yiiframework的CJuiSliderInput小部件将输入字段转换为范围滑块:http://www.yiiframework.com/doc/api/1.1/CJuiSliderInput#maxAttribute-detail

我似乎无法使代码正常工作,这是视图中的当前代码:

<?php foreach($settings as $i=>$value): ?> 
    <?php $setting=UserSetting::model()->findByPk($value->setting_id); ?> 
    <h4><?php echo CHtml::encode($setting->label); ?></h3> 
    <?php echo CHtml::activeTextField($value,"[$i]value"); ?>
<?php endforeach; ?>

我想用

替换activeTextField
$this->widget('zii.widgets.jui.CJuiSliderInput',array(
    'model'=>$model,
    'attribute'=>'[$i]value',
    'maxAttribute'=>'timeMax',
    // additional javascript options for the slider plugin
    'options'=>array(
        'range'=>true,
        'min'=>0,
        'max'=>10,
    ),
));

我需要填写哪些值才能让它工作?每个textField输入来自不同的型号btw。

控制器看起来像这样(不知道你是否需要它):

$settingsvalues = UserSettingValue::model()->findAll('client_id=:id', array(
    ':id' => $id,                       
));                  
if(isset($_POST['UserSettingValue'])){   
    $valid = true; 
    foreach($settingsvalues as $i=>$value){
        if(isset($_POST['UserSettingValue'][$i]))
            $value->attributes = $_POST['UserSettingValue'][$i]; 
        $value->save(); 
        $valid = $value->validate() && $valid; 
    }
    if($valid)
        $value->save(); 
}
$this->render('settings',array(
    'model' => $model, 
    'settings' => $settingsvalues,
));

非常感谢!

2 个答案:

答案 0 :(得分:2)

我通过在滑块中放置一个javascript函数来解决问题。这并不是我在开始时的预期,但它会这样做。滑块现在更改输入字段中的值。

        <?Php               
               $this->widget('zii.widgets.jui.CJuiSliderInput',array(
                    'name' => $i, 
                    'model'=>$value,
                    'attribute'=>"value",
                    'event'=>'change',
                   //'value'=>'$value',
                  'options'=>array(
                      'min'=>0,
                      'max'=>10,
                      'animate' => true,
                      'slide'=>'js:function(event,ui){$("#UserSettingValue_'.$i.'_value").val(ui.value);}',
                  ),
)); ?>            

答案 1 :(得分:1)

这个评论有点大。但请尝试以下

$this->widget('zii.widgets.jui.CJuiSliderInput',array(
  'name'=>'$setting->label',
  'attribute'=>'[$i]value',
  'value'=>$value,
  'options'=>array(
      'min'=>0,
      'max'=>10,
  ),
));

另请试试这个

$this->widget('zii.widgets.jui.CJuiSliderInput',array(
  'name'=>'$setting->label',
  'attribute'=>'[$i]value',
  'value'=>$value,
  'options'=>array(
      'min'=>0,
      'max'=>10,
  ),
 'htmlOptions'=>array(
    'style'=>'height:20px;',
),
));