SQLを使う案件【HTML編】

コメントする / エキスパート講師, ブログ / By

SQL 編では、wpdb クラスのプロパティやメソッドを使用して、SQL クエリを実行し、データベースから必要なデータを取得する方法について解説しました。

今回は、その取得したデータをもとに、次のような HTML テーブルを作成します。

予約日カレンダー名サービス名氏名

そのためには、取得したデータの構造とアクセス方法を理解する必要があります。

データの構造

SQL の実行結果は $results に代入したので、この変数のデータ構造を確認することから始めましょう。

$results

var_dump( $results );

この PHP 関数の実行結果から、$results のデータ型は array で、各要素は stdClass オブジェクトということが分かります。

foreach文

$results は配列なので、foreach 文を使って要素を取り出し、その値を $result に代入して、指定したコードを実行します。

配列の最後の要素に到達するまで、{} で囲われたコードを繰り返し実行します。

foreach ( $results as $result ) {
  テーブルの行を作成するためのコード
}

$result

$result は $results の各要素で、 stdClass クラスのオブジェクトです。

echo gettype( $result );

この PHP 関数の実行結果から、$result のデータ型は object ということを再確認できます。

stdClass は、メソッドやプロパティを持っていない汎用的な空のクラスです。

class stdClass {
}

$resultのプロパティ

４つのプロパティを持っています。

プロパティ名がカラム名と同じということに気づきましたか？

["カラム名"]=>string(数値)"値"

$resultのプロパティ値

次に、各プロパティの値について見ていきましょう。

scheduleUnixTime と name の値はシンプルな文字列です。

options と praivateData の値は JSON 形式の文字列です。

JSON 形式の文字列

JSON は JavaScript Object Notation の略です。

JavaScript オブジェクト表記で記述されたプレーンテキストです。

複数の「キー：値」が、カンマで区切られ、 {} で囲われていてます。

json_decode() というPHP 関数は JSON 文字列を PHP の値に変換します。

この関数を使って JSON 文字列をデコードすると、データ型が string から array に変わります。

データへのアクセス方法

データにアクセスする方法は、データ型によって異なります。

配列

配列の要素にアクセスするには角かっこ構文を使います。

通常配列のキーは整数つまり配列のインデックス、連想配列のキーは文字列です。

$配列名[キー]

オブジェクト

オブジェクトのプロパティにアクセスするにはアロー演算子／オブジェクト演算子（->）を使います。

$オブジェクト名->プロパティ名

配列とオブジェクト

foreach 文は、配列とオブジェクトのどちらにも使えます。

$反復可能な式のデータ型は、array または object のいずれかです。

foreach ( $反復可能な式 as $value ) {
    実行するコード;
}
foreach ( $反復可能な式 as $key => $value ) {
    実行するコード;
}

予約一覧表の作成

取得したデータの構造とアクセス方法が分かりましたね。

これで、HTML のテーブルを作成するため準備が整いました！！

ベストプラクティス

必要なデータを取り出して変数に代入する部分（ビジネスロジック）と HTML を作成する部分（ビューロジック）とを分けてコードを書くと、可読性が向上し、HTML テーブルのデザイン変更や拡張が容易になります。

結合代入演算子

テーブルの行を作成するコードは、foreach 文を使って繰り返し実行されるので、変数に値を代入するときは結合代入演算子（.=）を使用します。

$table_contents に代入した値を上書きしないよう注意します。

変数のパース

文字列が二重引用符で囲まれた場合やヒアドキュメントで指定された場合、 その文字列の中の変数はパースされます。

パースとは、展開や置き換えという意味です。

構文の型には、単純な構文と 複雑な構文の２種類があります。

複雑な構文は、$ が { のすぐ後に続く場合にのみ変数が認識されます。

ここでは、ヒアドキュメントと複雑な構文を使用して HTML コードを書いています。

コード

// SQLの実行結果がある場合はテーブルを作成する
if ( $results ) {

	// テーブル行を保持する変数を作成
	$table_contents = '';

	foreach ( $results as $result ) {

		//必要なデータを取り出して変数に代入する（ビジネスロジック）
		// 予約日時
		$date = date( "Y/m/d h:i", $result->scheduleUnixTime );
		// カレンダー
		$calendar = $result->name;
		// サービス
		$service = json_decode( $result->options )[0]->name;
		// 氏名
		$last_name = '';
		$first_name = '';
		$praivate_data_array = json_decode( $result->praivateData );
		if ( $praivate_data_array !== NULL) {
			foreach ( $praivate_data_array as $praivate_data_element ) {
				$value = $praivate_data_element->value;
				switch ( $praivate_data_element->id ) {
					case 'lastname':
						$last_name = $value;
						break;
					case 'firstname':
						$first_name = $value;
						break;
				}
			}
		}

		// HTMLテーブルを作成（ビューロジック）
		// 作成した変数をもとにテーブル行を作成
		$table_contents .= <<<EOD
			<tr>
				<td>{$date}</td>
				<td>{$calendar}</td>
				<td>{$service}</td>
				<td>{$last_name} {$first_name}</td>
			</tr>
		EOD;

	}

	// テーブルとヘッダー行を作成
	$table_header = <<<EOD
		<table>
			<tbody>
				<tr>
					<th>予約日時</th>
					<th>カレンダー</th>
					<th>サービス</th>
					<th>氏名</th>
				</tr>
	EOD;

	// テーブルを閉じる
	$table_footer = <<<EOD
			</tbody>
		</table>
	EOD;

	return $table_header . $table_contents . $table_footer;

} else { // SQLの実行結果がない場合はメッセージを返す
	return '<p>承認済みの予約が見つかりませんでした</p>';
}

ショートコードの作成

ショートコードの作成は簡単です。

WordPress のショートコードを作成するための関数を使用します。

add_shortcode( string $tag, callable $callback )

add_shortcode()

$tag

新しく追加するショートコード名です。

ショートコード名は、既に追加されている他のショートコードと競合しないよう、一意となるように注意します。

「zero1pg_」のような接頭辞を付ける方法が簡単です。

$callback

ショートコードが検出されたときに実行するコールバック関数です。

SQL 編と HTML 編で作成したコードを１つにまとめます。

コード

zero1pg_bookig_package_reservation_list() という関数は、戻り値があります。

SQLの実行結果がある場合は、$table_header . $table_contents . $table_footer を返します。

SQLの実行結果がない場合は、<p>承認済みの予約が見つかりませんでした</p> を返します。

function zero1pg_bookig_package_reservation_list() {
    SQL編とHTML編で作成したコード
}
add_shortcode( 'zero1pg_reservation_list', zero1pg_bookig_package_reservation_list );

まとめ

SQLを使う案件についての解説はこれで終わりです。

いかがでしたか？

思っていたよりも簡単だったのではないでしょうか。

WordPress のクラスや関数、データの構造やアクセス方法についての理解を深めると、できることが増ると思います。

これをきっかけに、挑戦する案件が増えると嬉しいです！！

関連投稿

コメントする