【SPIRAL WebTools】フォームにGoogleカレンダーを埋め込む方法
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情報です、参考としてご利
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情報です、参考としてご利
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果の提供を行い、皆様のお役立てができればと思っています! ※学生が学びの一環として調査・まと
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情報です、参考としてご利用くだ
Thymeleaf(タイムリーフ)は属性名th:~で指定された値を処理し様々なHTMLを生成することができます。 本記事ではソース設定を行う際、Thymeleafでよく使用されている記載についてまとめています。 Thymeleafの記法や動作についてはSPIRAL
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果の提供を行い、皆様のお役立てができればと思っています! ※学生が学びの一環として調査・まとめた内容です。 正確な仕様や最新情報は、公式リファレン...
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情報です、参考として
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情
本記事では、テキストフィールドの入力項目を、登録フォーム入力ステップ上にプルダウンで表示するサンプルプログラムです。 ここでは、対象のDBのテキストフィールドをAPIで取得し、プルダウンで表示するサンプルプログラムを紹介いたします。 対象のプルダウンとなるフィールドを登
SPIRAL v1の一覧表ページにAIチャットパネルを追加し、日本語で話しかけるだけでDBを検索・集計できる「自然言語検索フォーム」のサンプルプログラムです。 OpenAI GPTのFunction Callingを使って自然言語を検索条件に変換し、SPIRAL外
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情報です、参考としてご利用くださ
入力フォーム上で金融機関・支店を検索一覧から選べるようにし、選択結果をフォーム項目へ格納する構成を紹介します。 検索用の中継PHPは、本フォームとは別にSPIRAL内にもう1つ「ダミーフォーム」(見えないダミー項目だけで構成した空フォー
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果の提供を行い、皆様のお役立てができればと思っています! ※学生が学びの一環とし
フォーム上で金融機関・支店を検索一覧から選べるようにし、選択結果を項目へ格納する構成を紹介します。 検索用の中継は、フォームとは別にSPIRAL内にもう1つページを作成し、そのPHPタブ・BODYタブに貼り付ける前提です。ページのURL
フォームでデータを入力する際、こんなお困りごとありませんか? ・商品一覧のExcelファイルから商品コードをコピペするのが面倒 ・担当者の入れ替えがあり、その都度「担当者」の選択肢を修正しないといけない 今回は、レコードリストブロックとJavaScriptと組
経費精算で領収書やレシートの情報を手入力していませんか? 本記事では、OpenAI GPT-5.2 APIを活用して領収書・レシートのOCR解析と勘定科目の自動分類を実現する方法を紹介します。 不正検知も実装し、 より堅牢な経費管理システム
お問い合わせフォームから届く内容を人手で分類・振り分けしていませんか? 本記事では、OpenAI APIを活用してお問い合わせの自動分類・ルーティングを実現する方法を紹介します。 カテゴリ分類、緊急度判定、感情分析、LTV予測、
SPIRAL ver.1では、トランザクションDB機能がございます。 トランザクションDBは、登録データをトランザクションデータとして受け付け、DBに格納しているマスタデータに反映するデータベースです。 SPIRAL WebToolsは、トランザクションDB
SPIRAL WebToolsのデータベースを、AIと自然言語で操作できたら便利だと思いませんか? 本記事では、MCP(Model Context Protocol)を使ってSPIRAL WebToolsのAPIをMCPサーバーとして実装し、Claude
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情
SPIRAL ver.1ではテキストエリアフィールドで抽出ルールを作成することが仕様上できず、 テキストエリアフィールドに値が入力されていない方を抽出することができないようになっています。 しかし、セレクトフィールドを使用し、入力の状態に合わせたフラグを立てていただくこと
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果の提供を行い、皆様のお役立てができればと思っています! ※学生が学びの一環として
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学
経費精算で領収書やレシートの情報を手入力していませんか? 本記事では、OpenAI GPT-5.2 APIを活用して領収書・レシートのOCR解析と勘定科目の自動分類を実現する方法を紹介します。 不正検知も実装し、 より堅牢な経費管理システムを
アンケートを実施した際、回答が偏ってしまった経験はありませんか? 本記事では、回答のバイアスを防ぐために選択肢の順番をシャッフルする方法を解説します。 反映イメージ デモサイトはこちら 上記デモサイトでは、リロードする度にシャッフルされます。 作業手順 処理コード PHPを使用するページには、以下の専...
選択肢のシャッフルは、アンケートの回答バイアスを防ぐために有効な方法ですよね。 しかし単純にシャッフルしてしまうと、「その他」や「特にない」といった選択肢まで途中に混ざってしまい、 回答者が混乱する原因になります。 本記事ではアンケート作成の第二弾として、特定の項目だけを末尾に固定するカス
一覧表で、複数レコードのステータスを一括で更新できたら便利だと思いませんか? 標準機能では一つずつ操作する必要がありますが、JavaScriptを活用することで一括操作が可能になります。 本記事では、選択した複数行のステータスを一括で変更できる便利なカスタマイズをご紹介します。 反映イメージ デモサイトはこ...
お問い合わせフォームから届く内容を人手で分類・振り分けしていませんか? 本記事では、OpenAI APIを活用してお問い合わせの自動分類・ルーティングを実現する方法を紹介します。 カテゴリ分類、緊急度判定、感情分析、LTV予測
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情報です
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果を提供を行い、皆様のお役立てができればと思っています! ※学生による調査・補足情報です、参考としてご利用ください。
本記事では、テキストエリアの入力枠の下に入力した文字数を表示するJavaScriptの実装方法を紹介します。 この機能により、テキストの入力制限をかけている場合に「でも今どのくらい入力していて、 どの程度減らせばいいかわからない」といった事態を解消することが可能で
本記事では、SPIRAL(ver.1)の クリックカウント と Google Analytics 4(GA4) を組み合わせて、 「メールでアンケートURLを送ったときに 誰がクリックしたか、 フォームを開いたが未回答か」などを把握し、 リマインド・フォーム改善
本記事では、SPIRAL WebTools の クリックカウント/HTMLメール開封確認 と Google Analytics 4(GA4) を組み合わせて、 「メールでアンケートURLを送ったときに 誰がクリックしたか、 フォームを開いたが未回答か」などを把握
SPIRALのPHPを利用して、予約フォームの登録をきっかけに Googleカレンダーへ予定(イベント)を自動作成し、 作成したイベント情報(イベントID/URL、必要ならGoogle Meet URL)を同じレコードへ書き戻す サンプルプログラ
SPIRALのDBトリガーを利用して、予約レコードの登録・更新をきっかけに Googleカレンダーへ予定(イベント)を自動作成し、 作成したイベント情報(イベントID/URL、必要ならGoogle Meet URL)を同じレコードへ書き戻す サン
2026年1月6日のver.2.41アップデートにより、SPIRAL WebToolsにPDF帳票の機能が追加されました。 本記事では、PDF帳票の機能につきまして紹介いたします。 機能概要 PDF帳票とは、スパイラルのDBに格納された情報をPDFテンプレート上に出力・ダウンロードすること
SPIRALのPHPを利用して、予約フォームの登録をきっかけに Web会議(Google Meet / Zoom)を自動作成し、 発行した会議URLを同じレコードへ書き戻すサンプルプログラムの実装方法を紹介します。 Web会議の発行ま
本記事ではページを作成した際のURLについて案内いたします。 変更・改定履歴 [ 2026.01.22 ] 改定 各識別名のルールを追記 作成前からURLを決めることが可能 ページのURLはサイト識別名やページ識別名などを組み合わせから決まるため、 実際に作成する前からどんなURLになるかを判別する...
SPIRALのDBトリガーを利用して、予約レコードの登録・更新をきっかけに Web会議(Google Meet / Zoom)を自動作成し、 発行した会議URLを同じレコードへ書き戻すサンプルプログラムの実装方法を紹介します。 We
SPIRAL WebTools では、標準機能としてログイン日時を自動で登録する仕組みは提供していません。 そのため、ログイン履歴を確認したい場合は、管理画面の「認証エリアログ」から確認いただけますが、 こちらはサイト全体の管理権限をお持ちの方のみ閲覧可能となっています。 アプリ利用者が
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果の提供を行い、皆様のお役立てができればと思っています! ※学生が学びの一環として調査・まとめた内容です
SPIRAL WebToolsでフォームを作成し、いざJavaScriptを組み込んで便利にしようしたときに「あれ? うまく動作しない」ということはありませんか? 本記事ではフォームブロックにjavaScriptを組み込む際の気をつけなければいけないところや知っていると
カスタムAPIを使ってリアルタイム売上ダッシュボードを作成するサンプルプログラムを紹介します。 本記事は「最小構成で動作検証 → 実DB連携」の2段階で解説します。 開発初期はカスタムAPI(モックデータ)でUIと動作をすばやく検証し、その後に本番データへ
電話番号をAPIで取得した際、形式がE164形式となり、+81から電話番号になります。 本記事では、APIで電話番号を取得した際に国内形式を変更するコードを紹介いたします。 注意点 今回ご紹介するコードは、「+81」の日本の形式のみを変更します。 別途変更したい場合には、プ
本記事では同じパスワードを使い続けないように世代管理を行う方法をご紹介いたします。 過去のパスワードを5世代保存し、新しく入力されたパスワードと比較することで、同じパスワードを使用していないかチェックします。 SPIRALではフィールドタイプがパスワードの場合、登録後の入力内容の
SPIRALで作成した複数ステップにまたがるフォームでは、 通常ユーザーは一つ前のステップにしか戻ることができません。 例えば、ステップ4からステップ1に直接戻るような、任意のステップへの移動は標準機能では提供されていません。 また、セキュリティ上の理
SPIRALに蓄積されたお問い合わせ履歴は、顧客対応の品質を向上させるための貴重な資産です。 しかし、「キーワードが完全一致しないと探せない」「表記ゆれでヒットしない」といった理由で、 過去の類似お問い合わせを探すのに時間がかかっていませ
本記事では、日付フィールドに入力された生年月日から現在の年齢を算出する方法について解説します。 システムやフォームで年齢を自動計算したい場面に役立つ内容となっており、 具体的な計算式や実装のポイントもご紹介します。 はじめに 本記事では、SPIRAL ver.1の日付フィ
本記事ではトリガ機能を使用してDBのテキストフィールドに対し、数字が登録・更新された際に0埋めを行い、桁数を揃える方法をご紹介いたします。 今回は、データの桁数を4桁として、登録/更新されたデータが4桁以下の場合に0埋めをいたします。 データの見た目を整える際や、社員番号などの管理番号を
認証エリアにて、認証DBと異なるDBのレコードリストを作成し、そのリストの中から対象のレコードを変更したい場合などがあるかと思います。 本記事では、ビジュアル設定のレコードリストと更新フォームを使用して、レコードリストのレコードに対して更新する方法をご紹介し
本記事では、別ページに設置したPHPを活用して、非同期通信を用いたシンプルなデータ検証システムを実装する方法をご紹介します。 この仕組みでは、ユーザが入力したテキストを別ページのPHPで検証し、その結果をフロントエンドで即時にフィードバックすることが可能です。
学生インターンシップです! スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。 補足情報や調査結果の提供を行い、皆様のお役立てができればと思っています! ※学生が学びの一環として調査・まとめた内容です。 正
SPIRALでお問い合わせフォームを作成するケースは多くあると思います。 一方で海外からの宣伝や意味不明な文字列、お問い合わせではなく自社の宣伝といった 「スパム投稿」に悩まされることも少なくありません。 これらのスパムは、データベースを汚
SPIRALでお問い合わせフォームを作成するケースは多くあると思います。 一方で海外からの宣伝や意味不明な文字列、お問い合わせではなく自社の宣伝といった 「スパム投稿」に悩まされることも少なくありません。 これらのスパムは、データベースを汚
SPIRALのPHPライブラリで取得したレコードの日付や時刻フィールド、 「そのままでは比較しづらい」「曜日や和暦を手軽に表示したい」と感じたことはありませんか? この記事では、日付・時刻処理を便利にする、コピペで使えるPHPのお役立ち関数セットを紹
SPIRAL APIで取得したレコードの日付や時刻フィールド。 「そのままでは比較しづらい」「表示形式を手軽に変えたい」と感じたことはありませんか? 特に、日時、日付、月日、時刻 など、複数のフィールドタイプを統一的に扱うのは意外と手間がかかります。 この記事
フォームで選択された内容に応じて、特定の担当者にだけメールを送信したい場合があるかと思います。 本記事では、セレクト項目の選択内容に合わせて、メールの送信先を振り分ける方法をご紹介します。 本設定で実装できること 本実装では、選択されたセレクト項目により、メールアクションにて異なる送
この記事ではSPIRALからSalesforceへのレコード連携について、メソッドごとにサンプルコードをまとめています。 SPIRAL WebTools とSalesforceをAPI連携したアプリケーションを構築する時の参考になれば幸いです。 SalesforceのREST
この記事ではSPIRALからSalesforceへのレコード連携について、メソッドごとにサンプルコードをまとめています。 SPIRAL ver.1 とSalesforceをAPI連携したアプリケーションを構築する時の参考になれば幸いです。 SalesforceのREST AP
内閣府から祝日の一覧を取得+DBへ格納し、祝日マスタをプログラムでメンテナンスする方法をします。 概要 ・祝日情報は内閣府(www8.cao.go.jp)から取得する ・取得したデータをDBに格納する ・一定期日前より前の日付は取り込まない ・12/31、1/2、1/3は追加で登録する 祝日
フォームを作成した後に文字数などの関係でフィールドタイプを変更したい場合があります。 SPIRAL ver.1ではDBに設定しているフィールドのフィールドタイプを後から変更することができません。 変更する場合はDBに新たなフィールドを追加し、フォーム上フィールドを差替える対応
通常、フォームはマイエリアのデザイン設定から出力してカスタムページに貼り付けますが、変更のたびに編集が必要で自動反映はできません。 ただし、自動POST転送を使えば、マイページ経由でフォーム設定を反映できます。 解決方法:フォーム
ビジュアル設定の登録/更新フォームで、項目をグループ化して横並びにする方法をご紹介します。 この例では、「姓」と「名」使って説明しています。 グループ化とは 複数のフィールドをグループパーツ化してフォームページに表示させる機能です。 ビジュアル設定は、登録フォームブロックと更新フ
フォームでセレクトフィールドを表示する際、IDではなくラベル名で表示させたいケースもあると思います。 本記事では、そのような場合にAPIとThymeleafを使ってラベル名で表示する方法をご紹介します。 APIでセレクトフィールドのラベル名を取得
SPIRAL ver.1をご利用の皆さん、「一覧表をもっと見やすくできたら…」と思ったことはありませんか? 今回は、そんなお悩みを解消するために、一覧表を手軽にリッチ化し、スマホでも見やすくデザイン性のある画面を作成する方法をご紹介します。 一覧表のテンプレートを
ステップアンケートは、PC向けまたは携帯電話向けのデザインのみ対応しており、スマートフォン向けのデザインには対応していません。 本記事では、CSSやHTMLを調整することで、スマートフォンからも見やすいデザインに変更する方法をご紹介します。 カスタム
SPIRALの単票ページで、データが未入力の項目(行)を自動的に非表示にするJavaScriptの実装方法を紹介します。 これにより、データが入力されている項目のみをスッキリと表示させることができ、ユーザーにとって見やすい画面を作成できます。 実装の概要 今回のコードでは、以下の流れで処理を
最近ではWeb会議ツールを使用したセミナー、ウェビナーが主流となってきています。 参加する側は気軽に参加ができ、運営する側はWeb会議ツールを用意するだけでよく会場の手配などが不要なので、両者にメリットがありそうです。 そんなウェビナー管理ですが、SPIRAL WebToolsでは申
ブラウザ上でCSVファイルを解析し、SPIRALのデータベースに一括更新するサンプルプログラムを紹介します。 注意点 ・ このサンプルは、SPIRALのページで動作することを前提としています。 ・ 更新先のDBと、CSVの列構成を事前に一致させておく必要があります。 ・
ブラウザ上でCSVファイルを解析し、SPIRALのデータベースに一括更新するサンプルプログラムを紹介します。 注意点 ・ 付属のJavaScript CSVパーサーは簡易的なものです。複雑なCSV(改行を含む値など)には対応できない場合があります。 ・ 更新先のDB(サ
ブラウザ上でCSVファイルを解析し、SPIRALのデータベースに一括登録するサンプルプログラムを紹介します。 注意点 ・ 付属のJavaScript CSVパーサーは簡易的なものです。複雑なCSV(改行を含む値など)には対応できない場合があります。 ・ 登録先の
本記事では、セレクトフィールドの選択内容に応じて★マークで視覚的に評価を表示するシステムの実装方法を紹介します。 評価システムを導入するだけで、ユーザーの選択内容が直感的に把握でき、入力体験の向上とエンゲージメント向上に寄与します。軽量で既存フォームに簡単に組み込み可能です。 ポイント:
SPIRAL ver.1ではDBに対してデータの一括登録・更新が可能です。 データ一括登録・更新を実施する際、 登録方法は【登録(ヘッダー無データの登録)】と【定型登録(ヘッダー有データの登録)】の2種類あります。 本ページでは【定型登録(ヘッダー有データの登録)】を使ったデータ
一覧から詳細画面へ遷移するリンクが見づらいと思ったことはありませんか? リンクをボタン化することで、ユーザーにとって直感的にわかりやすくなり、操作性(ユーザビリティ)の向上につながります。 本記事では、一覧機能の“裏ワザ”第七弾として、一覧の詳細画面リンクをボタン風にカスタマイズする方法
入力されたパスワード強度を視覚的に分かるUI 概要 ユーザーが入力するパスワードの強度をリアルタイムで視覚的にフィードバックするUIコンポーネントです。 強度メーターと条件チェックリストにより、ユーザーは安全なパスワードを直感的に作成できます。セキュリティ向上とUX改善に繋がり、会員登
一覧機能で「特定の日付」や「特定の値」「ログイン中のユーザー名」などが、最初から入力されていたら便利だと思ったことはありませんか? 本記事では、一覧機能の“裏ワザ”第五弾として、一覧画面にアクセスした時点で検索項目に初期値をセットする方法をご紹介します。 反映イメージ ▶ デモサイトはこちら 上記の例で...
本記事では、フォーム入力の進捗度を可視化するプログレスバーの実装方法を紹介します。 プログレスバーを設置するだけで、入力の現在地がひと目で分かり、離脱抑止と完了率向上に寄与します。軽量で既存フォームに簡単に組み込み可能です。 ポイント: 視覚的な進捗提示は入力ストレスの低減に有効 導入効
一覧機能では、初回アクセス時の表示件数はデフォルトで「10件」に固定されています。 しかし、ちょっとした工夫で「100件」や「1000件」など、任意の件数を最初から表示させることが可能です。 本記事では、一覧機能の“裏ワザ”第六弾として、初回アクセス時の表示件数を
一覧機能の検索で、日時をカレンダーで指定できたり、チェックボックスをプルダウン形式に変えられたら便利だなと思ったことはありませんか? 本記事では、一覧機能の“裏ワザ”第四弾として、検索項目の入力タイプを変更する方法をいくつかご紹介します。 ※本方法を適用するにはxslファイルを
レコード照合フォームブロックのソースの構造や役割を解説いたします。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法 をご参照ください。 また、Thymeleaf関連記事をまとめた Thymeleaf特集 も是非ご覧くだ
この記事では、SPIRAL® ver.1と、経済産業省が運営する法人情報のオープンデータ提供サービス「gBizINFO」を連携する方法をご紹介します。 「gBizINFO」について 経済産業省が運営する法人情報のオープンデータ提供サービスです。
ブラウザ上でCSVファイルを解析し、SPIRALのデータベースに一括登録するサンプルプログラムを紹介します。 注意点 ・ このサンプルは、SPIRALのページで動作することを前提としています。 ・ 登録先のDBと、CSVの列構成を事前に一致させておく必要があり
SPIRALからxの投稿を取得する方法。 概要 Webフォームから指定したX (旧Twitter) ユーザーIDの投稿を取得し、任意で指定したキーワードを含む投稿を絞り込んで表示するPHPツールです。 X、SPIRALとの連携を実現することで、キャンペーン等で応募者が指
SPIRALのフォームでエラーサマリーを表示するJavaScriptをご紹介します。 機能としてはエラーメッセージをカウントし内部リンクによってエラー位置に遷移するというシンプルなものですが、どこでエラーが起きたかを一目で把握でき、エラー位置までクリッ
一覧上でステータスを「未完了」から「完了」に更新することはよくあります。 ですが、「完了」にした後は「未完了」に戻せないようにしたい、と思ったことはありませんか? 本記事では一覧機能の“裏ワザ”第三弾として、ステータスの値に応じて一覧編集モードを非活性にする方法を紹介します。 ※本方法
サイト機能のレコード検索ブロックでは、「テキスト」「セレクト」「マルチセレクト」「日付」フィールドのみが検索対象として設定することができます。 しかし「メールアドレス」や「電話番号」など、レコード検索ブロック非対応フィールドで作成されたフィールドを検索したい場合があると思います
本記事では作成済みの一覧表(設定デザイン)に表示項目を追加する方法をご案内します。 一覧表・単票 設定デザイン2種について 一覧表の設定デザインには「表形式」と「数値」の2種類があります。 まず違いについてそれぞれご紹介します。 表形式 一覧表作成時点のデフォルトでは「表形式」が選択されてい
データ行がないときに、一覧のヘッダーだけが表示されて「これを消したい」と思ったことはありませんか? 本記事では一覧機能の“裏ワザ”第二弾として、データ行がないときに一覧のヘッダーを非表示にする方法を紹介します。 ※本方法を適用するには、xslファイルのソースを一部編集する必要があります。
APIを使用して一覧表からデータ更新時にメールを送信する方法をご紹介します。 概要 一覧表から一括でステータスの更新等を行うことはよくありませんか? 単票と違って一括で更新できるので便利ですよね。 ただ、フォームを使用せず更新するためサンクスメールが使えない落とし穴があります。 即時で送る
一覧上で「完了」したものと「未完了」のもの、重要な項目などをひと目で区別したい場合があります。 本記事では一覧機能の“裏ワザ”第一弾として、値に応じて一覧項目の背景色を変える方法を紹介します。 ※背景色を変更するには、xslファイルのソースを一部編集する必要があります。編集前にはバックアップを取るこ...
SPIRAL WebToolsでは内覧の予約受付から内覧後のアンケート、検討状況の確認対応やメール配信を行うモデルルーム予約管理アプリの構築が可能です。 アプリ(DB)設計・構築 / サイト設計・構築 / ユーザ・アプリロール・グループ設定 に各工程を分け、ポイントやおすすめ
フローティングラベルを使用してSPIRALのフォームの入力体験を向上させる方法をご紹介します。 フォームのデザインテンプレートも用意いたしましたので、ダウンロードして試してみてください。 フローティングラベルとは?実装するメリット まずはデモサイトを
SPIRALのフォームでパスワードを変更する際に、新しいパスワードが現在のパスワードと重複していないかをチェックするサンプルプログラムを紹介します。 SPIRAL APIのレコード認証機能を利用することで、サーバーサイド(PHP)で安全にチェッ
同じアンケート項目で、ユーザーが回答時にどの店舗から登録したのかを自動で判断できるようにしたいケースなどはないでしょうか? 店舗などの登録経路を自動的に判断したい場合、アンケート項目が同じであればフォームを店舗分用意することなく、 一つのフォームでパラメータと
問合せフォームなどで、入力された支店コードごとに登録通知メールを振分け配信したい場合があります。 本記事では登録通知メールの振分け機能では対応できない場合の設定案をご案内します。 登録通知メール フォーム登録時に担当者宛に登録されたことを通知メールとして即時で配信
フォームを入力するユーザーのPC、ブラウザの環境によってライトモードとダークモードを自動で切り替える方法をご紹介します。 デモサイトをご用意しました。 デモサイト フォームのデザインテンプレートも用意いたしましたので、ダウンロードして試してみてください。 ダークモー
マルチセレクトの項目を登録フォームブロックの「確認ページ」にて、選択されたラベルを横並び・カンマ区切りで表示させる方法について紹介いたします。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。
アンケートフォームなどで、「第一希望」「第二希望」のように複数の項目を選択してもらう際に、 同じ項目が選ばれるのを防ぎたい場合があります。 このページでは、JavaScriptを使用して、フィールド間の重複選択を動的に不可にする方法を、 プルダウンメニューとラジオボタンの2
View Transition APIを使用してSPIRALのフォームでスムーズなページ遷移をする方法をご紹介します。 View Transition APIとは View Transition APIはLPのような単一ページアプリケーションにおけ
アンケートフォームなどで、「第一希望」「第二希望」のように複数の項目を選択してもらう際に、 同じ項目が選ばれるのを防ぎたい場合があります。 このページでは、JavaScriptを使用して、フィールド間の重複選択を動的に不可にする方法を、 プルダウンメニューとラジオボタンの2
SPIRALフォームにおけるメールアドレス入力欄にドメイン部分のサジェスト機能を追加する方法について紹介いたします。 はじめに メールアドレス入力欄にドメインのサジェスト機能を実装する方法として、以下の2種類の方法があります。 1. サジェストするドメインを全てソース内で管理
フォームの日付入力欄は、ユーザーにとって入力が煩雑になりがちな要素です。 特に、年月日が別々のテキストフィールドになっている場合、UI/UXの低下を招くことがあります。 本記事では、既存の年月日入力欄を、 直感的に操作できるカレンダーピッカーに置き換えるJavaScrip
SPIRAL WebTools APIでは、複数のレコードを操作する方法として「bulk」と「batch」の2つの方式が提供されています。これらの違いを理解することで、適切なAPIを選択し、効率的なデータ処理を実現できます。 bulkとbatchの基本的な
本記事ではソースの編集を行わずに、フォームの入力・選択項目に文言やURLを追記する方法をご案内します。 個人情報の取り扱い同意のチェック項目等で補足説明を表示したいときなどにご活用ください。 設定デザインで項目に文言追加する方法 フォームの設定メニュー「フィールド別チェック」
SPIRAL WebTools APIでレコード一覧を取得する際に使用される「offset(オフセット)」パラメータについて、基本的な概念から実践的な使い方まで解説します。ITの専門知識がなくても理解できるよう、わかりやすく説明していきます。 offsetとは? offset(オフ
本記事では、HTMLのチェックボックス群において、 「その他」の選択肢(特定のチェックボックス)が選ばれた際に、 関連するテキスト入力欄を動的に活性化・非活性化するJavaScriptの実装方法を紹介します。 この機能により、ユーザーが
SPIRAL WebToolsのAPIやPHPでDB操作を行う際の where条件の記述・データ型の扱い・関数利用で つまずきやすいポイントをまとめました。 サポートサイト(公式ドキュメント)を参考に、 「なぜか動かない」「エラーになる」事例とその回避策を解説します。 where
SPIRAL ver.1のフォーム機能は、データの収集や登録、通知に広く活用されている基本機能のひとつです。 しかし、仕様に対する理解が不足していると、思わぬ制限や挙動に戸惑うケースがあります。 本記事では、開発や運用時によく見ら
カスタムAPIを使ってリアルタイム売上ダッシュボードを作成するサンプルプログラムを紹介します。 本記事は「最小構成で動作検証 → 実DB連携」の2段階で解説します。 開発初期はカスタムAPI(モックデータ)でUIと動作をすばやく検証し、その後に本番データ
アンケート作成時などに項目数が多く、設問ごとに見出しを設定したい場合、 HTMLソース編集を行う必要があるため、諦めてしまうことがあるかと思います。 本記事では、標準機能で中見出しを設定する方法をご案内いたします。 デモはこちら 設定方法 アンケートフォームにて設問
SPIRAL ver.1の一覧表機能は、データベースのレコードを表示・管理する上で非常に便利ですが、 仕様上の制限や設計上の注意点を把握していないと、意図しない動作やトラブルにつながる可能性があります。 ここでは、現場
本記事では、アンケートの回答を受け付けた後、 メールにてギフトコードが閲覧可能なURLを送信する方法について紹介します。 全体像 予めギフトコードDBにギフトコードを格納しておきます。 アンケート回答フォームよりアンケートを回答すると、ギフトコードDBのギフトコードに紐
本記事では、アンケートの回答を受け付けた後、 メールにてギフトコードが閲覧可能なURLを送信する方法について紹介します。 全体像 予めギフトコードDBにギフトコードを格納しておきます。 アンケート回答フォームよりアンケートを回答すると、ギフトコードDBのギフトコードに紐
SPIRALで作成した予約フォームのデータを自動的にGoogleカレンダーに反映させることで、予約管理の効率化が図れます。 本記事では、外部連携ツール「Zapier(ザピアー)」を使用して、SPIRALの予約データをGoo
本記事では特定の文字列をフォームに入力した際に、データ送信を完了させずにエラーを出す方法をご案内します。 誹謗中傷内容などを登録させたくない場合にご活用ください。 想定の挙動 今回はトリガ機能のエラー終了設定を利用します。 フォーム上設定した項目に特定の文字列を入力し、送信し
本記事では、PDFをアップロードして自動解析し、 フォームのフィールドへ情報を自動入力する仕組みを2種類ご紹介します。 pdf.js を用いてブラウザ上でPDFを解析し、 OpenAIのサービスを利用してテキスト情報を抽出する方法になります
SPIRAL WebToolsでは内覧の予約受付から内覧後のアンケート、検討状況の確認対応やメール配信を行うモデルルーム予約管理アプリの構築が可能です。 アプリ(DB)設計・構築 / サイト設計・構築 / ユーザ・アプリロール・グループ設定 に各工程を分け、ポイントやおすすめ
DBトリガのレコードアクションでは、自DBのレコードを更新または他DBへレコードの登録/更新/削除を実行することができます。 プログラムを使用せずに実行できるため非常に便利な機能ですが、特定のフィールドは使用できなかったりと注意すべき事項があります。 今回は、テキスト
本記事では、ローコードツール「SPIRAL ver.1」で利用可能な機能を一覧形式でご紹介します。 各機能の概要や制限事項、詳細マニュアルへのリンクもあわせて掲載しており、導入検討中の方や設定作業中の方に特におすすめの内容です。 こんな方に向けて書いてます SPIRAL ver.1で何が
公開前のフォームなど、まだ第三者には見せたくないサイトなどが検索エンジンで表示されて困ってしまうケースなどはないでしょうか? ユーザーズデスクでは、お客様よりGoogle検索に表示されないようにしたいというお問い合わせを多く頂いております。本ページでは作
標準ではチェックボックスで表示される複数選択可能なマルチセレクトフィールドを択一選択のプルダウン表示に変更する方法をご案内します。 DB構成を変えずに複数選択から択一式に変更したい場合などご活用ください。 イメージ図 DB設定 マルチセレクトタイプのフィールドにラベル
姓名のフィールドをそれぞれ別で設定されている場合、データ収集後に姓名を一つのデータとして外部システムに登録する場合などに成型に手間取ることがあります。 本記事ではスパイラル側で自動的に複数フィールドの結合データを取得する設定方法をご案内します。 DBに姓名フィー
DBに格納したPDFをレコードアイテムブロックで描画するサンプルを紹介します。 レコードアイテムブロックにデフォルトで出力されるファイルフィールドのリンクはダウンロード専用になっており、 画面上に描画する事が出来ません。 そのため、PDFを画面上に描画するために本
ユーザーが入力した氏名や生年月日、年齢などの個人情報を1つのフィールドにまとめたいという要望を多く頂いております。 今回は、DBトリガを使用して、1つのフィールドにまとめる方法をご案内いたします。 DBトリガの詳細は サポートサイトをご確認ください。
カスタムAPIを利用してマスタDBを検索しプルダウンに反映するサンプルプログラムを紹介します。 今回は社員検索フォームを題材にサンプルの実装方法を解説します。 本記事では、社員マスタデータベースから階層的に本部、部署、課、社員を選択し、 社員IDをhidd
RESTful APIを簡単に利用するためのカスタムAPIクライアントのライブラリを作成しました。 カスタムAPIクライアントを使用することで、バックエンドとフロントエンドの連携が容易になり、 データベース操作やメール配信ジョブの管理などの機能を簡単にできるだけでな
本特集は、非エンジニア向けに、素早くスパイラルを理解し、利用していただくため、今まで蓄積したナレッジのまとめたものです。サポートサイトのコンテンツを補足する役割であり、主な操作はサポートサイトからご確認してください。 変更・改訂履歴 [ 2025.05.09
本特集は、非エンジニア向けに、素早くスパイラルを理解し、利用していただくため、今まで蓄積したナレッジのまとめたものです。サポートサイトのコンテンツを補足する役割であり、主な操作はサポートサイトからご確認してください。 こんな方を向けに書いてます 初めて
JavaScript(fetch API)を使用して、レコードアイテムを読み込み、 設定されているファイルURLをダウンロードURLに差し替えるの実装方法を紹介します。 ファイルをDBに格納することで、ログイン時のみファイルをダウンロードさせたい場合に便利な
アクセス時に検索項目のみ表示させ、検索実行後にレコードリストを表示させる方法を紹介します。 デモを確認 イメージ 未検索 上記のように未検索の場合は一覧ではなくメッセージを表示することが可能です。 検索後 検索ボタンを押すと条件の入力・未入力に関わらず、レコードリストブロック
この記事では、「データの登録→取得→更新→削除」のAPIの疎通確認ができるサンプルプログラムです。 初めてPHPを利用してAPIでデータを操作する方は参考にしてください。 はじめに 内部呼び出し(スパイラル内部で動作させる場合)を利用した疎
セレクトは標準ではDBで設定した順番に表示されますが、ソースを編集することで 好きな順番、必要な選択肢だけを出すことが可能となっております。 登録フォームブロックのラジオボタンで変更方法案内いたします。 イメージ図 ※ ラベル2を非表示にし、ラベル1・4・5・3の順番で表
セレクトは標準ではDBで設定した順番に表示されますが、ソースを編集することで 好きな順番、必要な選択肢だけを出すことが可能となっております。 登録フォームブロックのプルダウンで変更方法案内いたします。 イメージ図 ※ ラベル2を非表示にし、ラベル1・4・5・3の順番で表示し
ver.2.35でリリースされたカスタムAPI機能を利用して開発を行う際、 Basic認証を利用する事で外部環境からでもテスト環境に接続を行い、デバッグすることが可能です。 本記事では、Basic認証を利用したデバッグ方法を解説します。 ※特定IPアドレス制限を利用
本記事では、ver.2.35でリリースされたカスタムAPIを活用して、非同期通信を用いたシンプルなデータ検証システムを実装する方法をご紹介します。 この仕組みでは、ユーザが入力したテキストをカスタムAPIのPHPで検証し、その結果をフロントエンドで即時にフィードバック
SPIRAL WebToolsでは内覧の予約受付から内覧後のアンケート、検討状況の確認対応やメール配信を行うモデルルーム予約管理アプリの構築が可能です。 アプリ(DB)設計・構築 / サイト設計・構築 / ユーザ・アプリロール・グループ設定 に各工程を分け、ポイントやおすすめ
本記事では、ver.2.35でリリースされたカスタムAPIを活用して、OpenAIのチャットAPIを呼び出すチャットボットウィンドウを出力するJavaScriptの構築手法をご紹介します。 この仕組みでは、バックエンド側はPHPでカスタムAPIを実装し、 フロントエンド側はJa
フォームブロックに置いて各フィールドに対してスライダーを生成し、操作性を向上させるガジェットのご紹介です。 name値とスライダー設定を指定するだけで、自動的にスライダーが生成され、初期値が設定されます。 この様なイメージでスライダーを作成できます。 注意点 ・スラ
ここでは、 セミナー受付管理でご案内しているセミナー申込サイトを例に、SP.LINKS株式会社(旧ソニーペイメントサービス)が提供する決済代行サービスの「e-SCOTT」を利用して、都度および継続課金に対応したクレジット
全体像 SPIRALのDBにアップロードされるファイルのファイル名は、アップロード者依存してしまいます。 ファイル名をレコードの値にリネームし、管理しやすくするためのサンプルプログラムです。 例えば自動発番される会員IDを用いてアップロードされるファ
全体像 SPIRALのDBにアップロードされるファイルのファイル名は、アップロード者依存してしまいます。 ファイル名をレコードの値にリネームし、管理しやすくするためのサンプルプログラムです。 例えば自動発番される会員IDを用いてアップロードされるファ
全体像 SPIRALのAPIから取得したデータを暗号化し、ダウンロード可能な形式に変換します。 ダウンロードしたファイルは、別ページにて復号化し、CSVとしてダウンロードできます。 データを暗号化しダウンロードボタンに引き渡す設定 PHP <?//<!
全体像 SPIRALのAPIから取得したデータを暗号化し、ダウンロード可能な形式に変換します。 ダウンロードしたファイルは、別ページにて復号化し、CSVとしてダウンロードできます。 データを暗号化しダウンロードボタンに引き渡す設定 PHP <?php //-
SPIRALの登録フォームにてアップロードされたファイルを、 Googleドライブへアップロードするサンプルプログラムをご紹介いたします。 全体像 SPIRALのAPIを用いてDB内のファイルをダウンロードし、 そのファイルをGoo
SPIRALの登録フォームからアップロードされたファイルをAPIを用いてダウンロードし、 Googleドライブへアップロードするサンプルプログラムをご紹介いたします。 全体像 SPIRALのAPIを用いてDB内のファイルをダウンロー
GoogleColab を使ってSPIRALのDBにアップロードされているファイルをGoogleDriveにアップロードするプログラムを作成してみました。 GoogleColabとはGoogleの環境上でPythonコードを実行
GoogleColab を使ってSPIRALのDBにアップロードされているファイルをGoogleDriveにアップロードするプログラムを作成してみました。 GoogleColabとはGoogleの環境上でPythonコードを実行
APIで取得したデータをCSVにしてダウンロードが出来るボタンを設置する方法をご紹介いたします。 レコードリストの抽出条件とAPIでデータを取得する条件を一致させるとレコードリストのデータをダウンロードさせる様なボタンを作成することができます。 本記事のプロ
この記事では、レコードアイテムブロックで項目をグループ化させて横並びにする方法を紹介いたします。 レコードアイテムブロックで、姓名の項目を横並びにさせたい場合などにご活用ください。 グループ化とは 複数のフィールドをグループパーツ化してフォームページに表示させる機能です。 現
フォームブロックに置いて各フィールドに対して初期入力値を設定する強化ガジェットのご紹介です。 name値と入力値を指定するだけで、自動的にフィールドタイプを判定して初期値が入力されます。 注意点 ・入力コントロールで、[年/月/日][時/分/秒]の形式で設定してください ・HTML
ここでは、 セミナー受付管理でご案内しているセミナー申込サイトを例に、 ソニーペイメントサービス株式会社が提供する決済代行サービスの「e-SCOTT」を利用して、都度および継続課金に対応したオンラインI
ここでは、 セミナー受付管理でご案内しているセミナー申込サイトを例に、 SP.LINKS株式会社(旧ソニーペイメントサービス)が提供する決済代行サービス「e-SCOTT」を利用して、コンビニ決済サービス機能を
GoogleColab を使ってGoogleDriveに保存されているデータをSPIRALのDBへアップロードするプログラムを作成してみました。 GoogleColabとはGoogleの環境上でPythonコードを実行出来るサービ
SPIRALのカスタムプログラムでGoogleDriveのファイルをダウンロードし、 SPIRALのDBへファイルを格納するサンプルプログラムをご紹介いたします。 全体像 GoogleDriveのAPIを用いてGoogleDrive内のファイル
SPIRALのPHP(アクション>PHP実行)でGoogleDriveのファイルをダウンロードし、 SPIRALのDBへファイルを格納するサンプルプログラムをご紹介いたします。 全体像 GoogleDriveのAPIを用いてGoogle
GoogleColab を使ってGoogleDriveに保存されているデータをSPIRALのDBへアップロードするプログラムを作成してみました。 GoogleColabとはGoogleの環境上でPythonコードを実行出来るサービ
セレクト項目のラベル(選択肢)は、サイト上ではすべてのラベルが表示されます。 そのため特定のラベルだけを表示するというのは、ビジュアル設定やデフォルトのソースのままではできません。 この記事では特定のラベルをサイト上で非表示にする方法を紹介します。 実装イメージ
この記事では登録フォームブロックを使って知識テストの様なテストフォームを作成するサンプルをご紹介します。 点数計算をし、最後に出力及びDBへの記録もします。 全体像 機能 完了ステップにて正答か誤答か判定をしてその結果を出力します。 テストの点数配当を設定し、何点獲得したかを
この記事ではフォームに電子署名(マウスやスマートフォンのタップで描けるサイン)を、 追加する方法をご紹介いたします。 この様な形でマウスで文字を書く事ができます。 DB設定 電子署名を格納したいDBにフィールドタイプ:ファイルのフィールドを追加してください。 本サンプルにつきましては識別名をsig...
レコードアイテムブロックでは、値が空のフィールドがある場合、フィールドの表示名だけが表示されて値は非表示になります。 この記事では値がない場合にフィールドの行ごと非表示にする方法を紹介します。 実装イメージ 以下の実装イメージでは「ウェビナー視聴用URL」の値が空の場
この記事ではフォームに電子署名(マウスやスマートフォンのタップで描けるサイン)を、 追加する方法をご紹介いたします。 この様な形でマウスで文字を書く事ができます。 DB設定 DBを新規作成する場合はDBタイトルをsignDBとして作成してください。 既存のDBを利用する場合は後述するサンキューページ...
日付フィールドに生年月日を入力した際に年齢を自動取得するJavaScriptを紹介いたします。 JavaScript window.addEventListener('DOMContentLoaded', (event) =>
URLを簡単に受け渡しできるQRコードを画面上に表示させたい場合があります。 今回は、来場受付などでも活躍するこのQRコードを生成する方法を2種類ご案内いたします。 APIサービスで生成する方法 URLの末尾にお問い合わせ番号やメールアドレスなどのQRコードにしたい内容を記載することでQRコードを...
この記事では、レコード検索ブロックを使用したレコードリストブロック フィルタ設定方法を紹介いたします。 設定イメージ レコードリストブロックを作成するDB内に認証DBを参照先DBとする参照フィールドが存在する場合はレコード公開範囲のログインフィルタ設定
この記事ではSPIRALから株式会社サイボウズのkintoneへのレコード連携について、メソッドごとにサンプルコードをまとめています。 SPIRAL ver.1 とkintoneをAPI連携したアプリケーションを構築する時の参考になれば幸いです。 共通モジュール <?php
この記事では、SPIRALでの顧客マスタにおける所持ポイント管理と、商品交換フォームを通じたポイント使用フローを紹介します。 また、顧客マスタの所持ポイントがマイナスにならないように、データベース(DB)側とページ上でのエラー表示設定についても説明します。 DB
この記事ではSPIRALから株式会社サイボウズのkintoneへのレコード連携について、メソッドごとにサンプルコードをまとめています。 SPIRAL WebTools とkintoneをAPI連携したアプリケーションを構築する時の参考になれば幸いです。 デモサイト フォームから登録
DBトリガのレコードアクションを利用して、 アクション先DBフィールドの値をクリアする(NULL更新)設定方法をご紹介いたします。 DBトリガの詳細は サポートサイトをご確認ください。 ※登録フォーム/更新フォームの自動登録では値のクリアは対応していません。 ※レコードアクションの
フォームブロックの自動登録は、認証エリアにログインした人の属性情報やフォームURLのパラメータ値などをフォーム利用者に入力させずにDBに自動登録できる機能です。 会員情報を再入力させずにDB登録したり、キャンペーンフォームの流入元をURLパラメータ値で取得したり
以前に、フォームからデータが登録された際に SLACK に登録通知を行うサンプルプログラムを公開しました。 今回は、定期的に DB をチェックし、該当するレコードがあったら SLACK に通知を行う手順をご紹介します。 未対応のお問い合わせがあったら通知するユースケースを想
前回の記事 JavaScirptでセレクトをドリルダウン表示する のラジオボタンバージョンとなります。 JavaScriptソース document.addEventListener('DOMContentLoaded', function() {
APIによってレコード一覧を取得する場合、 1回のリクエストでは取得できるレコード数に制限があります。 limitの値が一回のリクエストで取得するレコード数ですが、こちらの上限値が200件までとなっております。 APIリファレンス この時に200件以上のレコードを取得
フォームブロックの締切設定により開始日時と終了日時を設定する事は可能ですが、 特定の時間(例えば営業時間9:00~18:00のみ)のみ表示したいであったり、土日はクローズしたいといった場合はデフォルトの設定では不可能です。 今回の記事は上記の設定を可能とする為のカスタマイズ記事となりま
登録フォームブロックにて選択したセレクト項目の内容によって、下位層のセレクト項目の内容を絞り込む方法(ドリルダウン表示)をご紹介します! 今回はjQueryを使わずにJavaScirpt(Vanilla JS)のみで作成しているため、ライブラリ等の読み込みは必要ありません
同じ項目や同じデザインのフォームを複数作成する際には、フォームブロックの複製がおすすめです。 本記事では、SPIRAL WebToolsでのフォーム複製方法をご案内します。 前提 同じDBに登録するフォームを複製する場合の方法です。 またSPIRAL WebToolsでは、ページ内にフォームブロッ...
URLに日本語が入ってしまう原因とその解決方法について紹介いたします。 URLに日本語が混ざる原因 ページで使用しているフォームブロックのステップ名に日本語が設定されていると、「s1_入力」のようにURLにもパラメータとして日本語が入ってしまいます。 フォームブロックのデ
背景として、多くの企業様にSPIRALをご利用頂き、 SPIRAL内にてお問い合わせ対応アプリケーションを構築し 毎日、大量の顧客からの問い合わせやフィードバックを受け取られて居ると存じます。 問い合わせに効率
ver.2.26のアップデートにより、DBトリガにカスタムプログラムアクションが追加されました。 このアップデートによりDBトリガの登録、更新、削除トリガをきっかけに、PHPプログラムを実行できるようになりました。 今回は、オンライン商談シ
Javascriptでフォームを操作する際にWebToolsではどのように行えば良いのか、という質問を多くいただいておりました。 本記事ではformタグにIDなどの属性を付与せずに「次へ」ボタンのイベントを取得する方法を紹介します。 設定の際の参考になれば幸いで
レコードリストブロックで項目を表示せずに、レコード検索ブロックで検索項目として設定する方法を紹介いたします。 本来はレコードリストで使用している項目しか検索項目に設定できない レコード検索ブロックの検索項目は、本来であればレコードリストブロックで表示項目として使用しているフ
レコードリスト機能を使うことで、ノンプログラミングで一覧表を作成することができますが、 標準機能以上のフィルタをかけたい場合や標準の検索ブロックで使用できないフィールドタイプを指定したいなどの場合は、 PHP/APIを作ってより高度な一覧を作成することもできます。 この記事で
フォームのステップをパラメータで判定し、それぞれのステップで動作するJavascriptを作成しました。 実際にサンプルコードを掲載しておりますので、特定のステップでJavascriptを動作させたい場合に活用してみてください。 デモはこちら 機能説明 Ja
フォームで入力項目を折り畳めるようにすることで、入力項目の繰り返しが多いフォームをスッキリとした見た目にすることができます。 この記事では、JavaScriptを使用し、ソース設定のフォームブロックで入力項目に折りたたみ機能を実装する方法をご紹介いたします。 折りたたみ機能
会員サイトを作成した時、複数アカウントの作成や、なりすましを防ぐために多要素認証を実装したいケースがあるかと思います。 この記事では AI CROSS株式会社が提供する「絶対リーチ!SMS」を利用して、会員登
請求書など、Webページに表示された画面をそのまま印刷したいという要望をいただきました。 今回は、Webページをそのまま印刷するためのボタン設置の方法について、紹介いたします。 ボタン設置 ボタンの設置方法は、シンプルです。 下記のタグを設置するだけでボタンが表示され、押下されると印
この記事では主キーのメールアドレスフィールド(入力必須、ユニーク)を用意しつつ、フォームでは重複を許可して登録させる方法をご紹介します。 設定イメージ 登録フォームにはユニーク制約が設定されていない別のメールアドレスフィールドを入力項目として用意します。 ただし、
Facebookのアカウント情報を利用して SPIRAL WebToolsにAPIで登録を行い、認証エリアにログインさせるサンプルプログラムを作成いたしました。 SPIRAL WebToolsとFacebookを連携して認証エリアにソーシャルログイン
DBで「姓」と「名」のフィールドを分けている場合、レコードリストを作成した際に列も分かれてしまいます。 この記事では姓と名を同じ列に結合して出力し、氏名として表示させる方法をご紹介いたします。 設定イメージ 「姓」と「名」のフィールドを分けている場合、レコードリストを作成す
Googleのアカウント情報を利用して SPIRAL WebToolsにAPIで登録を行い、認証エリアにログインさせるサンプルプログラムを作成いたしました。 SPIRAL WebToolsとGoogleを連携して認証エリアにソーシャルログインさせたい場合は
この記事では、レコード検索ブロックでセレクトフィールドの選択形式をプルダウンする方法を紹介いたします。 ラベル数の多いセレクトフィールドを、スペースを取らずに検索フィールドに含めたい場合などにご活用ください。 レコード検索ブロックでのセレクトの表示形式 レコード検
サイト機能でページを作成している際に、メニューページが必要になることがあります。 しかし、ソースでページを作成するのは難しいと感じる方もいるかもしれません。 この記事では、ビジュアル設定のフリーコンテンツブロックを使用して簡単に作成する方法をご紹介します。 メニューページとは 複数
SPIRAL WebToolsでフォームを作成する際には、 ソース設定であってもソース編集をすることなく項目名を変更することが可能です。 本記事では、ソース設定での項目名変更方法をご紹介します。 SPIRAL WebTools フィールドソース 解説 SPIRAL WebTo
レコードリスト(一覧表)からの情報反映 の記事で、単一情報の反映方法はご紹介いたしました。 今回は、Jquery を利用して リストの複数情報を入力画面に反映する方法を紹介いたします。 チェックボックスで複数選択後にボタンをクリックすると反映する仕組みになって
データの登録時にIDを自動発番させたいというご要望をよく耳にします。 サイト管理側でIDを自動発番をする場合は、1手間加える必要があるため(※ ver.2.23時点)、 今回、設定方法をご紹介いたします。 使用機能 DBの登録トリガ レコードアクション と サイトの登録フォームブロッ
フォーム入力の際にユーザで誤ってブラウザなどを閉じて離脱するのを防ぐダイアログ機能を実装できる強化ガジェットを作成しました。 実際にサンプルコードを掲載しておりますので、コピペで簡単に実装できます。 フォーム入力中のユーザを補助する機能を強化したい場合に活
お問い合わせフォームに利用規約やプライバシーポリシーの内容を記載したいというご要望をいただくことがあります。 そんな時にお試しいただきたい設定方法がありますので、本記事にてご紹介いたします。 フリーコンテンツブロックでのページ作成 & テキストリンク設定方法
WebTools の API で日時フィールドに登録・更新する際、単純な日時形式でリクエストを行った場合はエラーになってしまいます。 こちらの記事では、どのようなデータ形式でリクエストを行えばよいか解説いたします。 はじめに APIで日時を登録・更新するPHPの
この記事では App Log のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ App Log APIメソッドごとの権限設定方法まとめ App L
登録フォームブロックでは自動登録の機能を利用して固定値を登録することができますが、更新フォームブロックには自動登録の機能がございません。(ver.2.22時点) この記事では、更新フォームブロックで固定値を登録する方法を3つ紹介いたします。 hidden属性で送信する方法 inputタグの
この記事では Email Job のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ Email Job APIメソッドごとの権限設定方法まと
レコードアイテムには、デフォルトでレコードリストに戻るリンクが付いていません。 ページリンク追加からレコードリストのページへ戻るリンクを追加することができますが、この方法で追加した場合はレコードリストで適用していたページ数、検索条件、ソート順、表示
DBトリガのレコードアクションでは、フィールドに値をマッピングする際に関数設定を利用することができます。 一見難しそうに見える関数設定ですが、サンプルを用意しましたのでぜひ参考にしてみてください。 レコードアクションの関数設定とは DBトリガのレコードアクションの処理マッピン
ver.2.22 より、参照フィールドのサイト対応が拡張されました。 本記事では、「参照フィールド拡張(サイト対応)」の概要をご紹介します。 参照フィールド活用方法は「ウェビナー申込システム」を例として記載している記事がありますので、詳細は以下記事をご参照ください。 活用方法 参照フ
SPIRAL WebToolsでは、参照フィールドを上手く活用することで様々な機能を実装することができます。 本記事では「ウェビナー申込システム」を例にとり、実際の活用方法を解説いたします。 参照フィールドとは 参照フィールドは、同一アプリ内にある別DBのレコードを参照
登録・更新時の完了画面でアップロードされた画像を表示させるサンプルプログラムを作成いたしました。 写真投稿キャンペーンなどで、完了画面でアップロードされた画像を表示したい場合は、ぜひ参考にしてみてください。 また、ファイル添付時にサムネイルを表示させる強化ガジェ
コピペするだけでフォーム入力の際にリアルタイムで入力値をチェックしてくれる機能を実装できます。 簡単に実装できますので、フォーム入力補助機能を強化したい時に活用してみてください。 デモはこちら 機能・前提 機能 ・必須入力チェック ・メール
この記事では、レコード検索ブロックで項目をグループ化させて横並びにする方法を紹介いたします。 レコード検索ブロックで、姓名の項目を横並びにさせたい場合などにご活用ください。 グループ化とは 複数のフィールドをグループパーツ化してフォームページに表示させる機能です。 現在は登録フォ
ファイルアップロード時のデザインは標準では変更することができませんが、フォームブロックを設置したページに少し手を加えることで変更可能になります。 本記事では、ファイルアップロード時のデザインをCSSを使用して変更する方法をご紹介します。 ファイルアップロード時 画面イメージ フォ
この記事では Record (export) のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ Record (export)
SPIRAL WebToolsの電話番号フィールドはフォーム上から「03-1234-5678」で登録した場合でも、 認証エリア内に表示する際の引用値表示パーツでのデフォルト表示は、E.164番号形式の「+81312345678」となります。 この記事では、引用値
フォームで画像ファイルを添付した際にサムネイルを表示する強化ガジェットを作成しました。 ビジュアル設定で使用できる形にしていますので、ぜひ参考にしてください。 デモはこちら 仕様 ・JavaScript で送信しているため、対応していないブラウザがあります。 ・DOM
この記事では Express Email のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ Express Email APIメソッ
正規表現とは、文字列の集合を一つの文字列で表現する方法となり、設定されたパターンにマッチするかを判定するものになります。 SPIRAL WebToolsでは、DBのフィールドの設定で正規表現による登録内容の制限ができるようになっています。 今回は、正規表現の記載方法について説明いたします。参考に
SPIRAL WebTools のサイト管理での日付操作をまとめました。 レコード値、認証値や引用値などは、Thymeleaf で出力を行うため、出力方法や比較など日付を操作したい場合の参考にしてください。 レコード値の 日付/月日/時刻 フィールド
フォームブロックのコピペCSSをビジュアル設定のまま使用する強化ガジェットを作成いたしました。 コピペCSSを使ってみたいけどソース設定には切り替えたくない場合にぜひご活用ください。 フォームブロックのコピペCSSとは フォームブロックやログインフォ
更新フォームブロックのソースの構造や役割を解説いたします。 入力欄のインプットタグ部分については「更新フォームブロックのインプットタグ解説」をご覧ください。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。 ま
更新フォームブロックのインプットタグ部分の構造や役割を解説いたします。 更新フォームブロック全体のソースについては「更新フォームブロックのソース解説」をご覧ください。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご
この記事では Record File のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ Record File APIメソッドごとの権
削除フォームブロックのソースの構造や役割を解説いたします。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。 また、Thymeleaf関連記事をまとめた Thymeleaf特集 も是非ご覧ください。 関連記事
WEBサイト上でページのサイドや下部に追従して表示されるフローティングバナーは、 訪問したユーザがページを閲覧している際に常に表示されるため、特定のページへの導線として非常に有効的な手段の1つとなっています。 しかし、こうしたバナーはユーザにとってページを閲覧
ログインフォームブロックのソースの構造や役割を解説いたします。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。 また、Thymeleaf関連記事をまとめた Thymeleaf特集 も是非ご覧ください。
SPIRAL ver.1 で作成したフォームは同一URLで動作する仕組みとなるため、 「初回アクセスURLを独自ドメインにしたい」や「アクセス解析のためにサンキューページURLを独自ドメインにしたい」というご希望をよくお聞きします。 本記事では、入力ページ および サンキ
フォームからデータが登録された際に、Teams に通知を行いたい!という要望は多いかと思います。 通知する手順をまとめましたので、ぜひ参考にしてみてください。 変更・改定履歴 [ 2024.07.11 ] 改定 コネクタ廃止に伴う、WebHookの処理の削除 [ 2024.08.05 ]
getAuthRecordByFieldId でセレクト/マルチセレクトの値を取得するとテキスト形式で返ってきます。 テキスト形式で返ってきた値を配列に分解するサンプルプログラムを作成しました。 PHPで
フォームからデータが登録された際に、SLACK に通知を行いたい!という要望は多いかと思います。 通知を飛ばす手順 および サンプルプログラムを作成しましたので、 通知機能を作成したい方はぜひ参考にしてみてください。 変更・改定履歴 [ 2023.01.04 ] 改定 登録デ
フォームからデータが登録された際に、Teams に通知を行いたい!という要望は多いかと思います。 通知する手順をまとめましたので、ぜひ参考にしてみてください。 変更・改定履歴 [ 2023.01.04 ] 改定 登録データ追加時に500エラーになってしまう不具合を修正 [ 2023.03.
ソース設定フォームブロックのデザインを施す際に、ビジュアル設定で設定できるデザインを使用したいと思われたことはないでしょうか。 そんな時におすすめな方法がありますので、本記事でご案内いたします。 おすすめな方法 1からソースを書き換えるのは大変ですが、デザインを施した
この記事では Record (batch) のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ Record (batch) API
SPIRAL WebToolsのフォームのメールアクションでは、登録や更新があったレコードのメールアドレスにメールを送信することはできますが、複数のレコードや他DBのレコード宛てにメールを送信することはできません。 フォームの送信完了後に、条件に当てはまる複
SPIRAL では、サイト側のセッションは、最大60分となっています。 セッション時間を自動で延長をする強化ガジェットを作成しました。 同一画面で一定時間経過した場合にセッション延長を行うかの確認ダイアログも表示できるようにしています。 仕様 ・XMLHttpRequest を使用
標準機能では、IPアドレスとユーザーエージェントをサイト側から自動取得することができません。(ver.2.20時点) サイト側から登録する際に、IPアドレスとユーザーエージェントを取得し、更新させるPHPのサンプルプログラムを紹介します。 参考になれば幸い
メールマガジンアプリであれば「配信停止フォーム」、会員サイトアプリであれば「会員退会フォーム」など、 利用用途に応じて入力フィールドが存在しないフォームを作成することがあります。 SPIRAL WebToolsで作成する際にご注意いただく点がありますので、本記事でご案内いたしま
レコードリストブロックやレコード検索ブロック、レコードアイテムブロックにコピペするだけで使えるCSSを作成しました。 ビジュアル設定が使えないこれらのブロックでも、見た目をカスタマイズすることが可能です。 CSSの設定方法やカスタマイズ方法、実装時の注意点などを説明し
フォームブロック上でのセレクトフィールド入力コントロールは「ラジオボタン」と「プルダウン」が選択できます。 ビジュアル設定の場合はフィールド設定画面で入力コントロールの切り替えが可能ですが、ソース設定の場合はソース全体を入れ替える必要があります。 本記事ではソース入れ替え方法
この記事では Authentication(認証API)のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ Authe
多くの方が利用されているLINEとSPIRAL WebToolsを連携した、LINE会員アプリをご紹介します。 会員登録後はお問い合わせができ、自身のお問い合わせの履歴確認や自身宛の通知やお知らせの確認も可能です。 この記事は サイト設計・構築 のフェーズとなります。 LINE お問い
登録フォームを開いた際に、会員DBに登録済みのデータは自動で入力させたい場合のカスタマイズ方法をご紹介いたします。 データが引き継がれて入力の手間が省けることはもちろんのこと、他にも様々なメリットがあるため、ぜひ活用してみてください。 イメージ 1つのフォームブロックを認証ペ
ユーザの情報登録状況に応じて、リッチメニューを出し分けるサンプルプログラムを作成いたしました。 SPIRAL WebToolsとLINEを連携して認証エリアにログインさせるような会員サイトを作成しようと思っている方は、ぜひ参考にしてみてください。 関連記事
LINE公式アカウントのリッチメニューをユーザーの登録状態に応じて切り替えることが可能です。 その場合はLINE Messaging APIのリッチメニューAPIを使用してのデフォルトリッチメニュー設定と登録完了後のリッチメニューID取得が
LINEのアカウント情報を API を利用して SPIRAL WebTools に登録を行い、認証エリアにログインさせるサンプルプログラムを作成いたしました。 SPIRAL WebToolsとLINEを連携して認証エリアにログインさせるような会員サイトを作成
チャットのような形式でやり取り可能なお問い合わせ管理デモを作成しました。 アプリ側でもやり取りの履歴が確認でき、相互コミュケーションがとれるアプリケーションです。 この記事は サイト設計・構築 のフェーズとなります。 お問い合わせ管理デモを確認 関連記事はこちら アプリ(DB・メー
この記事では Record / Record (bulk) のメソッドごとに、サンプルコードをまとめています。 SPIRAL WebTools でAPIを使用する時の参考になれば幸いです。 APIメソッドごとのサンプルコードまとめ Re
日時・日付フィールドをフォームで使用する際にテキスト形式になっています。 入力欄を日付タイプ・時刻タイプで表示させる強化ガジェットを作成いたしました。 アクセス日から起算して、選択できる日付を絞れる機能も追加しているので、ぜひ活用してみてください! デモはこちら 変更・改
ページにすぐに実装できるヘッダとフッターのテンプレートを用意しました。 ロゴやメニューがカスタマイズでき、スマホ表示にも対応しています。 この記事ではテンプレートの設定方法やカスタマイズ方法、実装時の注意点などを説明していきます。 変更・改定履歴 [ 2023.01.16 ]
標準機能では、参照フィールドをサイト側から登録・更新できません。(ver.2.20時点) サイト側から登録・更新する際に、参照フィールドを更新させるPHPのサンプルプログラムを紹介します。 参考になれば幸いです。 変更・改定履歴 [ 2022.08.05 ] 改定 「ID
レコード検索ブロックのソースの構造や役割を解説いたします。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。 関連記事はこちら 登録フォームブロックのソース解説 登録フォームブロックのインプットタグ解説 更新フ
選択したセレクト項目の内容によって、下のセレクト項目が連動し項目を絞り込んで 表示されるようにするフォーム入力を補助する強化ガジェットを作成いたしました。 ラベルIDの設定に決まりがありますが、簡単に実装できますので、ぜひ活用してみてください! 前提・仕様 ・フォームブロックは
WebTools を使ってサイトを作る際に使用する Thymeleaf の小技を実用例を元に紹介します。 変更・改定履歴 [ 2022.07.29 ] 改定 「レコードID」の記述を「フィールドID」に変更 [ 2022.09.12 ] 追加 認証値の 日付/月日/時刻 の値を分解して表示する方法...
最近ではWeb会議ツールを使用したセミナー、ウェビナーが主流となってきています。 参加する側は気軽に参加ができ、運営する側はWeb会議ツールを用意するだけでよく会場の手配などが不要なので、両者にメリットがありそうです。 そんなウェビナー管理ですが、SPIRAL WebToolsでは申
レコードアイテムのソースの構造や役割を解説いたします。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。 関連記事はこちら 登録フォームブロックのソース解説 登録フォームブロックのインプットタグ解説 更新フォ
フォームブロックやログインフォームにコピペするだけで使えるCSSを作成しました。 今回は、表形式のシンプルな「テーブルデザイン」です。 グレー系の落ち着いたデザインですが、カスタマイズして自由な色を使用することも可能です。 CSSの設定方法やカスタマイズ方法、実装時の注意点
SPIRAL WebToolsではheadタグやCSSが個別で記載できるため、Webフォントを簡単に導入することができます。 この記事では、Webフォント(Google Fonts)についての簡単な紹介と、その設定方法を説明いたします。 Webフォントを使わ
レコードリストブロックのソースの構造や役割を解説いたします。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。 関連記事はこちら 登録フォームブロックのソース解説 登録フォームブロックのインプットタグ解説 更
多くのサイトでアクセス解析のために利用されている、Google Analytics(グーグルアナリティクス)ですが、 2020年10月には、新たなバージョンである Google Analytics 4(GA4)のリリースがされました。 そして、将来的に従
フォームの入力中、誤ってEnterキーを押してしまい、予期せずフォームを送信してしまうことがあると思います。 今回はEnterキーでフォームが送信されないようにする強化ガジェットをご紹介します。 前提・仕様 ・ブロックかページの JavaScript タブにコー
Web申請アプリ デモ、 キャンペーン応募アプリ デモでは、さまざまな用途のフォーム作成ができることを紹介してきましたが、 実はSPIRAL WebToolsはフォームだけではなく、CMS(コンテンツ マネジメント システム)のように会員サイトの作成も可能です。 ※ CMS(コンテンツ
SPIRAL WebToolsで作成したページは、基本的にフォントの指定がされていません。 この記事では、フォントの指定が無いときにどのようなことが起こるのかを説明し、フォントの指定場所とおすすめのフォント指定を紹介いたします。 Webフォントを利用したい場合は、ページにWebフォ
フォームブロックやログインフォームにコピペするだけで使えるCSSを作成しました。 今回は、白をベースとしたシンプルな「シンプルモダン」のデザインです。 サイトカラーやコーポレートカラーに合わせてカスタマイズすることも可能です。 CSSの設定方法やカスタマイズ方法、実装時の注意
キャンペーンを実施しようとした際に応募フォームのデザインはリッチにしたい、LPページを併せて作成したいという要望が多いのではないでしょうか。 SPIRAL WebToolsではデザイン作成時のソース設定はもちろんのこと、実はLPページのような静的なWebページの作成もできます。 「
SPIRERS ナレッジ向上チームで作成して公開している強化ガジェットについて、使い方と注意点をご説明いたします。 強化ガジェットとは 強化ガジェットは、SPIRAL WebToolsのサイト機能を強化するためのプログラムです。 プログラムが分からない方でも、コピーペーストして設定値を変更する
登録フォームブロックのインプットタグ部分の構造や役割を解説いたします。 フォームブロック全体のソースについては「登録フォームブロックのソース解説」をご覧ください。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照
登録フォームブロックのソースの構造や役割を解説いたします。 入力欄のインプットタグ部分については「登録フォームブロックのインプットタグ解説」をご覧ください。 Thymeleafの記法や動作についてはSPIRAL WebTools サポートサイト Thymeleaf記法をご参照ください。 ま
SPIRAL WebToolsはプログラミング経験がなくても、オリジナルの業務アプリの制作・カスタマイズできるローコード開発プラットフォームです。 詳しくは SPIRAL WebTools とはをご覧ください。 SPIRAL WebToolsを初めて操作する際に何をどう設定すればいいのか
プログラムでレコード値を自動発番できる強化ガジェットの設定方法をこちらの記事で解説します。 ※本記事は暫定的なご案内です。SPIRAL WebToolsの今後のバージョンアップに伴い、正式機能がリリースされた場合、 この記事は削除される可能性があります。 ※
スパイラルにはSlackとの連携プラグインはありません。 ですが、SPIRALのカスタムプログラムと、Slackのプラグイン「Incoming WebHooks」を利用することで、連携が可能になります。 本記事では、フォーム登録通知をSlackへ飛ばす
利用規約の同意チェックなど、チェック状態に応じて送信ボタンを非活性化・活性化する強化ガジェットを作成しました。 フォーム入力補助機能を強化したい時に活用してみてください。 変更・改定履歴 [ 2022.04.08 ] 改定 コメントアウトの文章を修正 [ 2022.07.14
アンケートフォームなどにある、選択肢で「その他」を選択した場合のみ、テキスト入力をしてほしい時に 入力欄の活性化・非活性化をJavascriptで制御する強化ガジェットを作成しました。 簡単に実装できますので、フォーム入力補助機能を強化したい時に活用し
reCAPTCHAとはスパムやbotなどによる悪質なアクセスからWebサイトを保護するための仕組みです。 Googleが提供するreCAPTCHAをSPIRALver1で作成したフォームに組み込むことができます。 DEMOはこちら reCAPTCHAの制御方法は複数ありますが、ここで
ブラウザ側で JavaScript が無効化されている場合、 サイトに JavaScript による制御を入れても当然動作しません。 意図せず無効になっている場合、正しくデータが登録されずに後続の処理に影響が出てくる可能性もあります。 今回、JavaS
SPIRAL WebToolsで追加された新しいメソッドである「Batch」のサンプルプログラムを作成しました。 「Batch」を使うことでCSV,TSV形式のデータを、API経由でSPIRALのデータベースに登録することが できるようになります。 マルチパート
PDF帳票で出力されるPDFデータをファイルデータとしてSPIRALに保存したい! という要望を聞きましたので、試しにPHPで作ってみました。 PDF帳票とは PDF帳票ファイルの取得のAPIは、バージョン1.13.2 (2020.7.10)のリリースで可
「マルチセレクトで選択できる数を制限したい!」とリクエストボードより投稿をいただきました。 要望にお応えして、”マルチセレクトで選択できる数を制限する強化ガジェット”を作ってみました! ビジュアル設定に対応していますので、制限を入れたいと思っている方は、ぜひ参考にしてく
ver.2 では、まだDB複製機能が実装されていません。(※) 今回は、 DB複製機能を作ってみました。 DBを複製して、どんどんDBを作りたいと思っている方は、ぜひ参考にしてください。 ※ 今後、実装される可能性があります。 前提 ver.2 のページ機能にプログラムを設置し
ver.2 では、まだアプリ複製機能が実装されていません。(※) 今回は、 アプリ複製機能(アプリとDBのみ)を作ってみました。 アプリを複製して、どんどんアプリを作りたいと思っている方は、ぜひ参考にしてください。 ※ 今後、実装される可能性があります。 前提 ver.2 の
完了画面でサイト内ページリンクに登録情報をパラメータとして付与する方法を紹介します。 「サイト内ページ選択」と「URL直接入力」の2種類の方法があり、記載方法が変わるため、両方を参考にしてください。 ※ 完了動作の「リダイレクト」「ページ内リンク」には対応していません
SPIRAL WebTools おいて、ver.2.18時点では、サイト側にファイルダウンロード機能が実装されていません。(※) 今回は、 DB に保存されているファイルをサイト側でダウンロード可能にするボタンを作ってみました。 ファイルをダ
JavaScript に PHP の値を引き渡す方法を3つご紹介したいと思います。 変更・改訂履歴 [ 2023.06.29 ] 改訂 data属性を利用した値の出力方法の変更 前提 SPIRAL WebTools では、 JavaScript タブ内に記述した内容は、
Thymeleaf の使い方(書き方)がよくわからないという質問を多くいただきましたので、よくある使い方をまとめました。 この記事は、【 MKupdate vol.4「SPIRAL WebTools.18 PHP」】を基に記載しています。 重複する部分がありますが、ご了承ください。 ま
SPIRAL WebTools.18 のアップデートで「PHP実行環境」がリリースされました。 前回のMK update でも ver.2 の メンテナンス性についてご案内しましたが、 今回も引き続き アップデートで利用可能となった PHPにつ
認証エリア内でレコード作成日時をさせるプログラムを作ってみました。 今後のアップデートで標準提供されるかもしれませんが、 現状の打開策として参考になれば。 事前に必要な情報 API を使用する際に必要な、API キー,アプリID,DB ID を取得します。 API キー
2021年11月30日にアップデートしたSPIRAL WebTools.18の新機能 / 機能改善の概要をご紹介します。 SPIRERSナレッジ向上チームのメンバーが実際に機能を試した感想もお伝えします。 今回、新機能「PHP実行環境」
WebTools ver.2.18 にて PHPが利用できるようになりました。 PHP が使えるようになったということで試しにカレンダーを作ってみました。 WebTools では、PHP + Thymeleaf なので、使い方の参考になれば。 当月の
レコードリストと JavaScript で リストの情報を入力画面に反映する方法を紹介いたします。 こちらを使って、ボタンをクリックすると担当者の一覧が表示され、IDを選択すると自動的に反映すると言ったことが可能です。 デモはこちら 変更・改訂履歴 [ 2023.04.
長くなってしまいがちなURLを簡単に受け渡しできるQRコード。 来場受付などでも活躍するこのQRコードを生成する方法を2種類ご案内いたします。 APIサービスで生成する方法 URLの末尾にお問い合わせ番号やメールアドレスなどのQRコードにしたい内容を記載することでQRコードを生成することができます。...
SPIRAL WebToolsでは、ソースを編集しなくてもテキストを修飾したりリッチな表現が可能となる”WYSIWYG”を搭載しています。 ”WYSIWYG”機能の概要について説明します。 変更・改訂履歴 [ 2024.02.29 ] 改訂 キャプ
入力フォーム上で、特定の選択肢が選ばれた場合にのみ、入力必須のテキストボックスを表示する方法をご案内いたします。 DEMOはこちら 「職種」で「その他」を選ぶと入力必須のテキストが表示されます。 フォームの設定 フィールドはセレクトフィー
選択したセレクト項目の内容によって、下位層のセレクト項目の内容を絞り込む方法(ドリルダウン表示)をご紹介します! 文章だと分かりづらいので、とりあえずDEMOを触ってみてください! DEMOはこちら 「会社名」「部署名」「役割」の3つのセレクト項目があり、「会社名」で選択した
Googleマップ上で取得することができる「共有用の埋め込みHTML(iframeコード)」の可変部分をDBに格納し、マップを表示する方法をご紹介します。 DEMOはこちら 一覧表のリンクをクリックするとGoogleマップ・Yahoo!マップが表示されます。 DBの設定 Googleマップ
CMSなどの外部のサイトとの連携の際に、認証エリアにAPIを利用してログインする方法を解説します。 利用シーン 認証APIを利用するとCMSなどとのシームレスな連携を実現できます。 例えば、CMSとの連携でセッション管理をWebTools側で行ったり、CMSからの遷移時にロ
フォームの入力中、誤ってEnterキーを押してしまい、予期しない挙動が発生してしまう時があるかと思います。 今回はEnterキーでフォームが送信されないようにする方法をご紹介します。 DEMOはこちら 入力の途中でEnterキーを押してもsubmitされません。 設定方法
スパイラルで一覧表を作成していると、「こんなことできたらいいな・・・」と感じる機会があるのではないでしょうか? 今回は、XSLソースを編集して、電話番号のフィールドに値がある場合のみ「アイコンと電話番号」を表示させて、値がない場合は「番号なし」と表示されるよう、デー
フォームでデータを入力する際、こんなお困りごとありませんか? ・商品一覧のExcelファイルから商品コードをコピペするのが面倒 ・担当者の入れ替えがあり、その都度「担当者」の選択肢を修正しないといけない 今回は、一覧表とJavaScriptと組み合わせてデータの入力を簡単にするソース
サポートデスクでは、日頃からスパイラルの設定について、たくさんのお問い合わせをいただき、お電話越しにご一緒に問題解決をさせていただいております。 そんな中、よくご意見をいただいているのが、メール配信の設定についてです。 スパイラルのメール配信機能(EXPRESS2)では、配信対象
データベースに登録された情報を、Webページやメール文面などに表示することができる差替えキーワード。 スパイラルを使う際には必ずと言っていいほど扱うもので、その種類や形式はフィールドタイプによってもさまざまです。 今回は、スパイラルからメールを配信する際に使える特殊な差替えキーワ
スパイラルの検索フォームは、「設定デザイン」または「ソースデザイン」からデザイン編集を行います。 ※これらの違いについては、前回のTips「検索フォームにカレンダー表示を実装する方法」でご紹介しています。 複数の検索対象フィールド、例えば「姓名を横並び」にする場合、ソースデザインか
スパイラルのWebアプリ機能を使えば、5分で検索機能のついた一覧表を作成することができます。 一覧表のデザイン設定方法は下記の2種類。 ・設定デザイン 「表形式」や「数値」を利用して、どなたでもデザインの設定を行うことが可能 ・ソースデザイン XMLやXSLの知識が必要ですが、
Webフォームの活用は幅広く、キャンペーンや会員登録など様々なシーンで用いられます。 スパイラル®が選ばれる理由のひとつに、フォームの活用のしやすさが挙げられますが、デフォルトのフォームはシンプルなHTMLです。 DEMOは、こちら ※“お名前”を参照くだ
個人情報の取り扱いに関する同意ボタンをチェックした後、JavaScriptで送信ボタンを有効化させる方法をご紹介します。 DEMOは、こちら “個人情報利用目的について”を参照ください。 HTMLの設定 データベースは、択一のセレクト(ラジ
vol.4では、星型レーティングの表示方法についてご紹介していきます。 DEMOは、こちら ※Q4を参照ください。 データベースの設定 データベースはマルチセレクトを選択します。 そして各フィールドのラベルは、評価内容を設定します。 今回のレーテ
マトリクス形式の選択フォームの作成方法をご案内しまし。 この形式は、同じ回答項目を持つ質問に対して有効です。 繰り返しの文章などが省かれ図形化されるので、回答がしやすくなります。 コツを掴めば、スパイラル®のフォームでも簡単に設定できます。 DEMOは、
[ 2022.04.26 ] カスタマイズ後のソースにエラーメッセージ出力用のタグを追加 ラジオボタン形式のセレクトフォームを設定して、“その他”の項目を設けた時に記述式の入力フォームを追加する方法をご案内します。 DEMOは、こちら ※Q2を参照くだ
顧客ロイヤルティを計測するためのNPS表示の設定を行います。 DEMOは、こちら ※Q6を参照ください。 HTMLの設定 まずはデータベースの設定を行います。 フィールドはセレクトのプルダウンを選択しておくとよいかと思います。 そしてフィール
JavaScriptを使って、フォームを自在に表示/非表示させる方法をご紹介します。 DEMOは、こちら ※Q5を参照ください。 onclickイベントの設定 データベースの設定は、択一のセレクト(ラジオボタン)とテキストフィールドの2
SPIRAL WebToolsでは、Googleが提供するreCAPTCHAをフォームに組み込むことができます。 reCAPTCHAとは、スパムやbotなどの悪質なアクセスからWebを保護するための仕組みです。 reCAPTCHAにはチェックボックスタイプと非表示タイプ