有Yii小部件吗；单选按钮设置”； - is there any Yii widget "Radio Button Set "?

is there any Yii widget "Radio Button Set "?

本文关键字：单选按钮设置 Yii 小部 | 更新日期: 2023-09-27

我在项目中使用引导程序，我想要一个类似下面链接中的单选按钮集。

<?php $radio = $this->beginWidget('zii.widgets.jui.CJuiButton', array(
'name'=>'checkbox-btn',
'buttonType'=>'buttonset',
'htmlTag'=>'span',
)); ?>
<input type="checkbox" id="check1" value="1" /><label for="check1">Checkbox 1</label>
<input type="checkbox" id="check2" value="2" /><label for="check2">Checkbox 2</label>
<input type="checkbox" id="check3" value="3" /><label for="check3">Checkbox 3</label>
<?php $this->endWidget();?>

但这似乎不起作用，它看起来像一个正常的radioButtonList不确定的表情符号我在yiistrap、yiiwheels、zii和yiibooster中搜索了一下，找不到类似于"作为按钮的收音机"的小工具。我应该为此包含jquery ui吗？我更喜欢使用已经存在的小部件。有什么建议吗？

这是一个有点重的html部分，但可以做到：

$($('#radio-btn').children()).click(function(){
    var input = $(this).is('input');
    input = input ? $(this).next() : $(this);
    $('.ui-state-active').removeClass('ui-state-active');
    input.addClass('ui-state-active');
    $('input').prop('checked','false');
    input.prev().prop('checked','true');
});

<script src="http://demo.bsourcecode.com/yiiframework/assets/7c93f9e4/jui/js/jquery-ui.min.js"></script>
<link href="http://demo.bsourcecode.com/yiiframework/assets/7c93f9e4/jui/css/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="radio-btn" name="radio-btn" class="ui-buttonset">
    <input type="radio" id="radio1" name="radio" value="1" class="ui-helper-hidden-accessible">
    <label for="radio1" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false"><span class="ui-button-text">Choice 1</span>
    </label>
    <input type="radio" id="radio2" name="radio" value="2" class="ui-helper-hidden-accessible">
    <label for="radio2" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false"><span class="ui-button-text">Choice 2</span>
    </label>
    <input type="radio" id="radio3" name="radio" value="3" class="ui-helper-hidden-accessible">
    <label for="radio3" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" role="button" aria-disabled="false"><span class="ui-button-text">Choice 3</span>
    </label>
</div>