README

概览

该类允许您以面向对象的方式轻松创建HTML表单按钮，并具有以下功能：

• 轻松设置属性和样式
• 内联/块布局的快捷方式
• 检查表单提交

注意：该类扩展了一个名为 HtField 的抽象类。继承的功能将不会在此处介绍。因此，如果您在理解某些内容时遇到困难，请参阅此文档。

安装

使用 composer

composer require flsouto/htbutton

用法

以下代码简单创建并渲染了一个名为 "action" 的按钮。请注意，默认情况下，按钮的标签是其自身的名称，首字母大写

<?php
require_once('vendor/autoload.php');
use FlSouto\HtButton;

$button = new HtButton("action");

echo $button;

上述代码将产生以下输出

<button id="58854a02812ac" name="action" style="display:block" value="58854a02812ac">Action</button>

指定标签

构造函数的第二个参数接受一个标签字符串

require_once('vendor/autoload.php');
use FlSouto\HtButton;

$button = new HtButton("action", "Save");

echo $button;

输出将是

<button id="58854a028153c" name="action" style="display:block" value="58854a028153c">Save</button>

使用标签设置器

如果您想在构造之后设置标签，请使用标签设置器

use FlSouto\HtButton;

$button = new HtButton("action");
$button->label("Save");

echo $button;

输出

<button id="58854a02816d6" name="action" style="display:block" value="58854a02816d6">Save</button>

内联/块布局

默认情况下，按钮以块模式渲染，这意味着它将始终出现在新的一行。要将其设置为在同一行上渲染，您必须调用 inline 方法

$button = new HtButton("action");
$button->inline(true);

echo $button;

输出将是

<button id="58854a028188d" name="action" style="display:inline-block;vertical-align:text-top" value="58854a028188d">Action</button>

如您所见，它只是向按钮的 "style" 属性添加了一些CSS属性。

使用 false 参数调用相同的方法将返回到块布局

$button = new HtButton("action");
$button->inline(true);
$button->inline(false);

echo $button;

输出

<button id="58854a0281a2a" name="action" style="display:block;vertical-align:text-top" value="58854a0281a2a">Action</button>

添加自定义CSS

将一个包含具有类似下面的 style 键的数组的数组传递给 àttrs 方法

$button = new HtButton("action", "Delete");
$button->attrs(['style'=>['background'=>'red','color'=>'yellow']]);

echo $button;

输出

<button id="58854a0281bb7" name="action" style="display:block;background:red;color:yellow" value="58854a0281bb7">Delete</button>

更改默认值

在表单提交事件中发送的值默认是一个随机字符串，它与按钮的id相同。因此，如果您想更改它，您必须更改id属性

$button = new HtButton("action", "Delete");
$button->attrs(['id'=>'delete']);

echo $button;

<button id="delete" name="action" style="display:block" value="delete">Delete</button>

检查按钮是否被按下

如果您在表单内嵌套按钮，您可能会需要检查该按钮是否被按下，以便您可以处理请求的操作

$_REQUEST['delete'] = 1; // pretend a form has been submitted

$button = new HtButton('delete');
$button->context($_REQUEST);

if($button->value()){
	echo 'Deleting...';
}

输出

Deleting...

处理多个按钮

有时您可能希望在表单中提供多个操作。在这种情况下，您可能需要多个按钮，并且能够知道哪个按钮被点击。以下代码片段显示了如何做到这一点

$_REQUEST['action_delete'] = 1; // pretend a form has been submitted

$updateBtn = (new HtButton('action_update'))->context($_REQUEST);
$deleteBtn = (new HtButton('action_delete'))->context($_REQUEST);

if($updateBtn->value()){
	echo 'Updating...';
}

if($deleteBtn->value()) {
	echo 'Deleting...';
}

输出将是

Deleting...

处理同名按钮

我不建议在同一个表单上给不同的按钮相同的名称，但是，因为我看到许多开发者使用这种模式，所以我决定包含一个示例，说明如何通过此API处理该问题。您基本上必须给每个按钮不同的id和价值，并在switch块中检查哪个被发送

$_REQUEST['action'] = 'update';

$updateBtn = new HtButton('action','Update');
$updateBtn->attrs(['id'=>'update'])->context($_REQUEST);

$deleteBtn = new HtButton('action','Delete');
$deleteBtn->attrs(['id'=>'delete'])->context($_REQUEST);

if(isset($_REQUEST['action'])){
	switch($_REQUEST['action']){
		case $updateBtn->id() :
			echo 'Updating...';
			break;
		case $deleteBtn->id() :
			echo 'Deleting...';
			break;
	}
}

输出将是

Updating...