html form

Html表單

用於產生 html 元素的輕量級 PHP 類別。

該軟體包除了 php-5.4 之外沒有任何依賴項

• 許可證：麻省理工學院

要求

• PHP 5.4.0 或更高版本

安裝

作曲家

Composer 是廣泛使用的 PHP 套件依賴管理器。此 Html-Form 在 Packagist 上以user-meta/html提供，並且可以透過執行composer require指令來安裝。若要為您的專案啟用 Composer，請參閱專案的入門文件。

若要使用命令新增此依賴項，請從專案目錄執行以下命令：

 composer require user-meta/html

開始使用

使用 Composer 透過 Html-Form 產生文字輸入的快速範例：

 <?php
require __DIR__ . ' /vendor/autoload.php ' ;
use UserMeta  Html  Html ;
echo Html:: text ( ' example ' );

輸出：

 < input type =" text " value =" example " />

幾乎所有類型的 html 元素都可以使用。 （例如：按鈕、電子郵件、div、p 等）

 echo Html:: button ( ' Submit Me ' );
echo Html:: email ( ' example email ' );
echo Html:: div ( ' example text ' );
echo Html:: p ( ' example text ' );

輸出：

 < input type =" button " value =" Submit Me " />
< input type =" email " value =" example email " />
< div > example text </ div >
< p > example text </ p > 

用法

基本用法

接受的論點

大多數元素接受兩個參數：

• $default ：預設值
• $attributes ：屬性數組
• echo Html::text($default, attributes);

對於像 select、radio 這樣的選項元素，它接受第三個參數作為$options

• $options ：選項陣列。數組可以包含鍵值對或僅包含值
• echo Html::select($default, attributes, $options);

使用名稱、id 和類別

若要指派 name、id、class 或任何其他屬性，請使用第二個參數 ( $attributes )

具有預設值、名稱、id 和類別屬性的文字欄位：

 echo Html:: text ( ' Example_Value ' , [ ' name ' => ' Example_Name ' , ' id ' => ' Example_ID ' , ' class ' => ' Example_Class ' ]);

輸出：

 < input type =" text " name =" Example_Name " value =" Example_Value " id =" Example_ID " class =" Example_Class " /> 

向元素添加屬性

您也可以將任何屬性新增到任何元素：

 echo Html:: text ( ' Example_Value ' , [ ' name ' => ' Example_Name ' , ' data-example ' => ' Example_Data ' ]);

輸出：

 < input type =" text " name =" Example_Name " value =" Example_Value " data-example =" Example_Data " /> 

使用必需、唯讀和停用

 echo Html:: email ( null , [ ' name ' => ' Email ' , ' required ' ]);
echo Html:: email ( null , [ ' name ' => ' Email ' , ' readonly ' ]);
echo Html:: email ( null , [ ' name ' => ' Email ' , ' disabled ' ]);

輸出：

 < input type =" email " name =" Email " required =" required " />
< input type =" email " name =" Email " readonly =" readonly " />
< input type =" email " name =" Email " disabled =" disabled " /> 

使用標籤

 echo Html:: email ( null , [
    ' name ' => ' Example_Name ' ,
    ' label ' => ' Email '
]);

 echo Html:: email ( null , [
    ' name ' => ' Example_Name ' ,
    ' label ' => [
        ' Example ' ,
        ' class ' => ' Class '
    ]
]);

輸出：

 < label > Email </ label >
< input type =" email " name =" Example_Name " /> 

 < label class =" Class " > Example </ label >
< input type =" email " name =" Example_Name " /> 

具有 id 和 class 屬性的 div：

 echo Html:: div ( ' example text ' , [ ' id ' => ' Example_ID ' , ' class ' => ' Example_Class ' ]);

輸出：

 < div id =" Example_ID " class =" Example_Class " > example text </ div > 

帶有標籤文字、id、類別和屬性的lebel

 echo Html:: label ( ' Some text ' , [ ' id ' => ' ID ' , ' class ' => ' Class ' , ' for ' => ' For ' ]);

輸出：

 < label id =" ID " class =" Class " for =" For " > Some text </ label >

使用複選框

預設選取的簡單複選框

 echo Html:: checkbox ( true , [ ' name ' => ' Name ' ]);
echo Html:: checkbox ( true , [ ' name ' => ' Name ' , ' value ' => ' Value ' ]);

輸出：

 < input type =" checkbox " name =" Name " value =" 1 " checked =" checked " />
< input type =" checkbox " name =" Name " value =" Value " checked =" checked " />

將第一個參數傳遞為 false 以表示預設未選取。 echo Html::checkbox(false)

複選框列表

建立具有預設值的複選框列表

 echo Html:: checkbox ( ' cat ' , [ ' name ' => ' Name ' , ' id ' => ' ID ' ], [ ' dog ' => ' Dog ' , ' cat ' => ' Cat ' ]);
echo Html:: checkbox ([ ' cat ' ], [ ' name ' => ' Name ' , ' id ' => ' ID ' ], [ ' dog ' => ' Dog ' , ' cat ' => ' Cat ' ]);

輸出

 < label > < input type =" checkbox " value =" dog " name =" Name " id =" ID_1 " /> Dog </ label >
< label > < input type =" checkbox " value =" cat " name =" Name " id =" ID_2 " checked =" checked " /> Cat </ label >

透過 POST 或 GET 方法取得值數組

 echo Html:: checkbox ([ ' cat ' ], [ ' name ' => ' Name[] ' , ' id ' => ' ID ' ], [ ' dog ' => ' Dog ' , ' cat ' => ' Cat ' ]);

輸出

 < label > < input type =" checkbox " value =" dog " name =" Name[] " id =" ID_1 " /> Dog </ label >
< label > < input type =" checkbox " value =" cat " name =" Name[] " id =" ID_2 " checked =" checked " /> Cat </ label >

使用選擇/單選

建立一個具有預設值、名稱和 id 屬性的選擇

 echo Html:: select ([ ' cat ' ], [ ' name ' => ' Name ' ], [ ' dog ' => ' Dog ' , ' cat ' => ' Cat ' ]);
echo Html:: select ([ ' cat ' ], [ ' name ' => ' Name ' ], [ ' dog ' , ' cat ' ]);

輸出

 < select name =" Name " >
    < option value =" dog " > Dog </ option >
    < option value =" cat " selected =" selected " > Cat </ option >
</ select >

< select name =" Name " >
    < option value =" dog " > dog </ option >
    < option value =" cat " selected =" selected " > cat </ option >
</ select > 

建立廣播列表

 echo Html:: radio ([ ' cat ' ], [ ' name ' => ' Name ' , ' id ' => ' ID ' ], [ ' dog ' , ' cat ' ]);

輸出

 < label > < input type =" radio " value =" dog " name =" Name " id =" ID_1 " /> dog </ label >
< label > < input type =" radio " value =" cat " name =" Name " id =" ID_2 " checked =" checked " /> cat </ label >

使用集合

多個元素可以組合在一起作為集合

 $ div = new Html ( ' div ' );
$ div -> p ( ' Hello World ' );
$ div -> text ( ' example ' );
$ div -> add ( ' Some plain text ' );
echo $ div -> render ();

輸出：

 < div >
    < p > Hello World </ p >
    < input type =" text " value =" example " />
    Some plain text
</ div >

Collection 使用Html建構子並接受兩個參數。

• $type （可選）：標籤名稱。 （例如表單、div）
• $attributes （可選）：屬性數組

表格範例

使用集合生成表單：

 $ form = new Html ( ' form ' , [ ' method ' => ' POST ' ]);
$ form -> div ( ' Enter your email and password for login ' );
$ form -> email ( '' , [ ' name ' => ' email ' , ' label ' => ' Email ' ]);
$ form -> password ( '' , [ ' name ' => ' password ' , ' label ' => ' Password ' ]);
$ form -> submit ( ' login ' );
echo $ form -> render ();

輸出：

 < form method =" POST " >
    < div > Enter your email and password for login </ div >
    < label > Email </ label >
    < input type =" email " name =" email " />
    < label > Password </ label >
    < input type =" password " name =" password " />
    < input type =" submit " value =" login " />
</ form > 

嵌套集合

使用嵌套集合產生 html 範本：

 $ html = new Html ( ' html ' );
$ head = $ html -> import ( ' head ' );
$ head -> title ( ' Example Title ' );
$ body = $ html -> import ( ' body ' );
$ body -> p ( ' Hello World ' );
echo $ html -> render ();

 < html >
    < head >
        < title > Example Title </ title >
    </ head >
    < body >
        < p > Hello World </ p >
    </ body >
</ html > 

用作 xml 生成器

 $ book = new Html ( ' book ' );
$ book -> title ( ' The Da Vinci Code ' );
$ author = $ book -> import ( ' author ' );
$ author -> name ( ' Dan Brown ' );
$ author -> nationality ( ' American ' );
echo $ book -> render ();

輸出

< book >
    < title >The Da Vinci Code</ title >
    < author >
        < name >Dan Brown</ name >
        < nationality >American</ nationality >
    </ author >
</ book >

先進的

可以透過呼叫其名稱來建立任何 html 元素。

 echo Html:: email ( ' [email protected] ' );
echo Html:: h1 ( ' Example Heading ' );

在底層，我們使用Html::input()作為輸入元素， Html::tag()作為 html 標籤

使用input法建立電子郵件輸入：

 echo Html:: input ( ' email ' , ' [email protected] ' );

使用tag方法建立h1：

 echo Html:: tag ( ' h1 ' , ' Example Heading ' );

將 html 新增到元素之前和之後

 echo Html:: email ( '' , [ ' _before ' => ' Before ' , ' _after ' => ' After ' ]);

輸出

Before < input type =" email " /> After

用另一個元素括起來。

 echo Html:: email ( '' , [ ' _enclose ' => ' div ' ]);
echo Html:: email ( '' , [ ' _enclose ' => [ ' div ' , ' class ' => ' Class ' ]]);

輸出

 < div >
    < input type =" email " />
</ div >
< div class =" Class " >
    < input type =" email " />
</ div >

設定選擇/多選/單選/複選框選項的幾種方法

 // Same value and label
echo Html:: select ( null , [], [ ' audi ' , ' bmw ' ]);

// Different value and label
echo Html:: select ( null , [], [ ' audi ' => ' Audi ' , ' bmw ' => ' BMW ' ]);

// Option with extra attributes
echo Html:: select ( null , [], [ ' ferrari ' => [ ' Ferrari ' , ' data-origin ' => ' Italy ' ]]);
echo Html:: select ( null , [], [[ ' value ' => ' ferrari ' , ' label ' => ' Ferrari ' , ' data-origin ' => ' Italy ' ]]);

輸出

 < select > < option value =" audi " > audi </ option > < option value =" bmw " > bmw </ option > </ select >
< select > < option value =" audi " > Audi </ option > < option value =" bmw " > BMW </ option > </ select >
< select > < option value =" ferrari " data-origin =" Italy " > Ferrari </ option > </ select >
< select > < option value =" ferrari " data-origin =" Italy " > Ferrari </ option > </ select >

將多種方式與一個選項陣列混合

 echo Html:: select ( null , [], [
    ' audi ' ,
    ' bmw ' => ' BMW ' ,
    ' honda ' => [
        ' Honda ' ,
        ' data-origin ' => ' Japan '
    ],
    [
        ' value ' => ' ferrari ' ,
        ' label ' => ' Ferrari ' ,
        ' data-origin ' => ' Italy '
    ]
]);

輸出

 < select >
    < option value =" audi " > audi </ option >
    < option value =" bmw " > BMW </ option >
    < option value =" honda " data-origin =" Japan " > Honda </ option >
    < option value =" ferrari " data-origin =" Italy " > Ferrari </ option >
</ select >

使用數值

 echo Html:: select ( null , [], [ 2 => ' Two ' , 4 => ' Four ' ]);

輸出

 < select >
    < option value =" 2 " > Two </ option >
    < option value =" 4 " > Four </ option >
</ select > 

安全

轉義輸出

轉義意味著刪除不需要的數據，例如格式錯誤的 HTML 或腳本標籤。

該函式庫將esc_attr套用至 value 屬性。 esc_url到href和src屬性。