SPIRALは、主にエンタープライズ向けのローコードプラットフォームになります。ローコードプラットフォームなので、プログラミング知識がなくともWebアプリケーションを開発できるのが魅力です。
SPIRALでは、テーブルへのデータ登録の際にフォームを生成できますが、その入力項目に他のテーブルにあるデータを表示させられます。今回は、その一例として、他のテーブルにあるデータをマスターデータとしてドロップダウン表示してみます。
注意点
SPIRALでは、SPIRAL内部で動作するアカウント内APIと、外部APIの2種類があります。今回はアカウント内APIを利用します。
アカウント内API SPIRAL ver.1 サポートサイト
準備
テーブルの作成
今回のテーブルは ShopMail とします。SPIRALの管理画面から、テーブルを作成します。フィールドは以下のように設定します。
| フィールド名 | サンプル値 | 型 | 差し替えキーワード |
|---|---|---|---|
| 店舗 | abcde001 | 数字・記号・アルファベット(32 bytes) | shop |
| メールアドレス | aaa@bbb.cc.dd | メールアドレス（大・小文字を無視） |
そして、マスターデータ用のテーブルを ShopList とします。こちらもSPIRALの管理画面から、テーブルを作成します。フィールドは以下のように設定します。ShopListについては適当なデータを登録しておきます。
| フィールド名 | サンプル値 | 型 | 差し替えキーワード |
|---|---|---|---|
| コード | abcde001 | 数字・記号・アルファベット(32 bytes) | code |
| 店舗名 | ABCDE Store | テキストフィールド(64 bytes) | name |
アカウント内APIの有効化
開発 ＞ スパイラルAPI より、 アカウント内API を有効化（ONにする）します。
フォームの作成
ShopMail テーブルのフォームを作成します。SPIRALの管理画面から、 Web ＞ フォーム を選択します。作成したテーブルに合わせて、フォームがあるかと思いますので、それを選択します。
フォームを選択したら、左側にある ページ設定 ＞ 入力ページ を選択します。
そして、 デザイン で ソースデザイン を選択し、 入力ページ用HTML に以下のコードを入力します。最初のPHP部分でドロップダウンに必要な情報を収集しています。
後半のPHP部分では、そのデータを使って実際にドロップダウンを生成しています。
<?php // <!-- SMP_DYNAMIC_PAGE DISPLAY_ERRORS=OFF NAME=TEST --> ?>
<?php
$selectdb = $SPIRAL->getDataBase("ShopList");
$selectdb->addSelectFields("code", "name");
$selectdb->addSortField("code");
$searchResult = $selectdb->doSelect();
?>
<!DOCTYPE html>
<html id="SMP_STYLE">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>店舗選択</title>
</head>
<body class="body">
<center>
<div class="body_tbl">
<h1>店舗選択</h1>
<!--SMP:DISP:REG:START-->
<p class="header_rmesg">必要事項をご入力の上、送信ボタンを押してください。</p>
<!--SMP:DISP:REG:END-->
<!--SMP:DISP:ERR:START-->
<p class="header_emesg">ご入力内容に不備がございます。エラーが発生した項目を修正し、送信しなおしてください。</p>
<!--SMP:DISP:ERR:END-->
<form method="post" action="/regist/Reg2">
<div class="smp_tmpl">
<dl class="cf">
<dt class="title">
メールアドレス <span class="need">＊</span>
</dt>
<dd class="data ">
<input class="input $errorInputColor:mail$" type="text" name="mail" value="$mail$"
maxlength="129">
<br>
<span class="msg">$error:mail$</span>
</dd>
</dl>
<dl class="cf">
<dt class="title">
選択店舗 <span class="need">＊</span>
</dt>
<dd class="data ">
<?php
$list = $searchResult["data"];
echo "<select name='shop'>\n";
echo "<option value=''>選択してください</option>\n";
foreach ($list as $select) {
$code = $select["code"];
$name = $select["name"];
$check = ($code == $SPIRAL->getParam("shop")) ? "selected" : "";
echo "<option value='" . $SPIRAL->escapeHtml($code) . "' " . $check . ">" . $SPIRAL->escapeHtml($name) . "</option>\n";
}
echo "</select><br>\n";
?>
<span class="msg">$error:shop$</span>
</dd>
</dl>
</div>
<input type="hidden" name="detect" value="判定">
<!-- HIDDEN_PARAM START -->
$form:hidden$ <!-- HIDDEN_PARAM END -->
<input class="submit" type="submit" name="submit" value="送信">
</form>
</div>
</center>
</body>
</html>
これで、フォームのURLを開くとドロップダウンにShopList テーブルのデータが表示されるようになります。
まとめ
今回はSPIRALのAPIを利用して、フォーム内に別なテーブルのデータを表示する流れを紹介しました。SPIRAL APIでは他にもデータの登録や更新、削除などもAPIを通じて行うことができます。
現在、SPIRALではエンジニアβという無料アカウントを配布しています。SPIRALに興味がある型はこちらから試してみてください。