最近由于业务需要，需要通过一个radio选项来关联多个form控件的联动。通过查看Laravel-Admin源码可知，radio框引入了JS的iCheck控件来重写radio组件。
通过某度，查到iCheck内置了大量的回调事件，可用来监听change、checked等事件。
回调事件
iCheck 提供了大量回调事件，都可以用来监听 change 事件
| 事件名称 | 使用时机 |
| ifClicked | 用户点击了自定义的输入框或与其相关联的 label |
| ifChanged | 输入框的 checked 或 disabled 状态改变了 |
| ifChecked | 输入框的状态变为 checked |
| ifUnchecked | checked 状态被移除 |
| ifDisabled | 输入框状态变为 disabled |
| ifEnabled | disabled 状态被移除 |
| ifCreated | 输入框被应用了 iCheck 样式 |
| ifDestroyed | iCheck 样式被移除 |
使用 on() 方法绑定事件：
$('input').on('ifChecked', function(event){
alert(event.type + ' callback');
});
以及常用方法：
- $('input').iCheck('check');：将输入框的状态设置为 checked
- $('input').iCheck('uncheck');：移除 checked 状态
- $('input').iCheck('toggle');：
- $('input').iCheck('disable');：将输入框的状态设置为 disabled
- $('input').iCheck('enable');：移除 disabled 状态
- $('input').iCheck('update');：
- $('input').iCheck('destroy');：移除 iCheck 样式
运用于Laravel-Admin中，案例如下：（仅供参考，版本1.7.14）
protected function form()
{
$form = new Form(new Users());
Admin::script("
$('input[name=\"case_type\"]').on('ifChecked',function(event){
if(event.target.value == 1){
$('input[name=\"data_source\"][value=\"2\"]').iCheck('enable');
}
if(event.target.value == 2){
$('input[name=\"data_source\"][value=\"2\"]').iCheck('disable');
}
});
");
$form->radio('case_type','案例类型')->options(['1'=>'普通案例','2'=>'特殊案例'])->default('1');
$form->radio('data_source', __('资料来源'))->options(['1'=>'市场调查','2'=>'交易查档','3'=>'网络查询'])->default('1');
return $form;
}
评论 (0)