3

我正在使用 yii-bootstrap 扩展并想使用复选框按钮组。渲染它的功能没有问题，但我不知道如何读取哪个按钮被选中，哪个没有。是否有可能将每个复选框绑定到模型的属性？

这是我目前使用的（它实际上是来自 yii-bootstrap 网站的精确副本）：

<?php $this->widget('bootstrap.widgets.TbButtonGroup', array(
  'type' => 'primary',
  'toggle' => 'radio', // 'checkbox' or 'radio'
  'buttons' => array(
    array('label'=>'Left'),
    array('label'=>'Middle'),
    array('label'=>'Right'),
  ),
)); ?>
4

3 回答 3

4

我需要这个按钮组来选择哪些详细信息应该用于在搜索中进行过滤。这就是为什么我的模型中有一些辅助属性（在这些示例中遵循命名约定）$leftSearch、$middleSearch 和 $rightSearch。

我希望按钮根据用户的选择保持推入或推出（否则会让人感到困惑，因为每次刷新后按钮都不会被按下，但搜索属性将存储在用户看不到的隐藏字段中）。我实现了使用

'active' => ($model->leftSearch)?true:false,

另一件事是数据值，它会根据用户在提交页面之前选择的内容而有所不同。这是通过以下方式完成的：

'data-value' => ($model->leftSearch)?0:1,

视图中的完整代码如下所示：

$this->widget('bootstrap.widgets.TbButtonGroup', array(
        'type' => 'primary',
        'toggle' => 'checkbox',
        'buttons' => array(
            array('label'=>'Left', 
                'active' => ($model->leftSearch)?true:false,
                'htmlOptions'=>array(
                    'data-field' => 'Model_leftSearch',
                    'data-value' => ($model->leftSearch)?0:1,
            ),),
            array('label'=>'Middle', 
                'active' => ($model->middleSearch)?true:false,
                'htmlOptions'=>array(
                    'data-field' => 'Model_middleSearch',
                    'data-value' => ($model->middleSearch)?0:1,
            ),),
            array('label'=>'Right', 
                'active' => ($model->rightSearch)?true:false,
                'htmlOptions'=>array(
                    'data-field' => 'Model_rightSearch',
                    'data-value' => ($model->rightSearch)?0:1,
            ),),
        ),
    ));
echo CHtml::activeHiddenField($model, 'leftSearch');
echo CHtml::activeHiddenField($model, 'middleSearch');
echo CHtml::activeHiddenField($model, 'rightSearch');

javascript与frostyterrier发布的完全相同

Yii::app()->clientScript->registerScript('buttonGroup', "
  $(function(){
   $('.btn-group a').click(function(){
    var fieldId = $(this).data('field');
    var value = $(this).data('value');
    $('#' + fieldId).val(value); 
   });
  });
", CClientScript::POS_END);

关于 javascript 部分，我唯一不明白的是，它在插入到上面的视图中时可以工作，但如果包含在某些外部 .js 文件中则不起作用。我认为它与 POS_END 有关，但我不是 javascript 专家。

于 2013-04-03T15:46:41.550 回答
2

我检查了 TbButtonGroup 的来源，似乎没有办法将每个复选框绑定到一个属性。但是，您可以使用数据属性将每个按钮链接到表示模型属性的隐藏字段。这可能是下一个最接近的事情，也可能需要最少的代码。您可以这样做：

PHP：要求您将模型存储在名为 $model 的变量中。放置在表单标签内。确保已加载 jQuery。

$this->widget('bootstrap.widgets.TbButtonGroup', array(
  'type' => 'primary',
  'toggle' => 'radio', // 'checkbox' or 'radio'
  'buttons' => array(
    array('label'=>'Left', 'htmlOptions' => array(
        'data-field' => 'Model_left',
        'data-value' => 1,
    )),
    array('label'=>'Middle', 'htmlOptions' => array(
        'data-field' => 'Model_middle',
        'data-value' => 2,
    )),
    array('label'=>'Right', 'htmlOptions' => array(
        'data-field' => 'Model_right',
        'data-value' => 3,
    )),
  ),
));
echo CHtml::activeHiddenField($model, 'left');
echo CHtml::activeHiddenField($model, 'middle');
echo CHtml::activeHiddenField($model, 'right');

在上面的代码中，单词 Model 需要替换为您的模型名称，单词 left、middle、right 需要替换为您的模型属性。数据值需要设置为您希望每个按钮表示的值。

Javascript：

Yii::app()->clientScript->registerScript('buttonGroup', "
$(function(){
    $('.btn-group a').click(function(){
        var fieldId = $(this).data('field');
        var value = $(this).data('value');
        $('#' + fieldId).val(value);
    });
});
", CClientScript::POS_END);

然后就可以正常提交表单了。

于 2013-02-23T12:32:19.273 回答
0

您可以为每个按钮设置 ID：

<?php $this->widget('bootstrap.widgets.TbButtonGroup', array(
  'type' => 'primary',
  'toggle' => 'radio', // 'checkbox' or 'radio'
  'buttons' => array(
    array('label'=>'Left', 'url' => '#', 'linkOptions'=>array('id' => 'btn_1')),
    array('label'=>'Middle', 'url' => '#', 'linkOptions'=>array('id' => 'btn_2')),
    array('label'=>'Right', 'url' => '#', 'linkOptions'=>array('id' => 'btn_3')),
  ),
)); ?>
于 2013-09-09T19:54:25.980 回答