按钮

addButton('name值', '按钮属性' [, '按钮类型'])" class="reference-link">addButton('name值', '按钮属性' [, '按钮类型'])

标识符：button

1.0.2版本开始支持

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
];
return ZBuilder::make('form')
    ->addButton('test', $btn)
    ->fetch();

默认情况下，按钮为button类型，也就是一个普通的按钮，不带任何事件，本身会有一个id，也就是上面的name参数。

比如上面的按钮，id默认为test，我们可以通过js来给它加事件，做我们想做的事情。

$('#test').click(function(){
    alert('按钮被点击了');
});

a标签按钮" class="reference-link">a标签按钮

如果有需要，我们可以把按钮改为a标签按钮，并添加按钮连接。

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
    'target' => '_blank',
    'href' => url('add') // 此属性仅用于a标签按钮，button按钮不产生作用
];
return ZBuilder::make('form')
    ->addButton('test', $btn, 'a')
    ->fetch();

需要注意的是，target和href属性仅适用于a标签按钮。

添加图标" class="reference-link">添加图标

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
    'icon' => 'fa fa-plus-circle',
];
return ZBuilder::make('form')
    ->addButton('test', $btn)
    ->fetch();

也可以只用图标，不显示按钮标题。

// 定义按钮属性
$btn = [
    'icon' => 'fa fa-plus-circle',
];
return ZBuilder::make('form')
    ->addButton('test', $btn)
    ->fetch();

更改按钮颜色" class="reference-link">更改按钮颜色

可以通过添加class属性，来改变按钮颜色。

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
    'icon' => 'fa fa-plus-circle',
    'class' => 'btn-success',
];
return ZBuilder::make('form')
    ->addButton('test', $btn)
    ->fetch();

禁用按钮" class="reference-link">禁用按钮

如果想默认禁用按钮，可以添加disabled。

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
    'icon' => 'fa fa-plus-circle',
    'class' => 'btn-success',
    'disabled' => '',
];
return ZBuilder::make('form')
    ->addButton('test', $btn)
    ->fetch();

修改按钮id" class="reference-link">修改按钮id

默认情况下，按钮的id值是name参数的值，如果需要修改按钮的id，可以直接给id另外赋值。

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
    'id' => 'newid',
];
return ZBuilder::make('form')
    ->addButton('test', $btn)
    ->fetch();

添加自定义属性" class="reference-link">添加自定义属性

除了一些常规的参数，还可以给按钮添加一些自定义属性，但仅限于“data-”开头。

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
    'id' => 'newid',
    'data-url' => url('add')
];
return ZBuilder::make('form')
    ->addButton('test', $btn)
    ->fetch();

添加布局宽度" class="reference-link">添加布局宽度

按钮也支持设定布局，但只能用addFormItem或addFormItems方法。

// 定义按钮属性
$btn = [
    'title' => '自定义按钮',
];
return ZBuilder::make('form')
    ->addFormItem('button:4', 'test', $btn)
    ->fetch();