一覧表で一括更新を可能にする方法
一覧表で、複数レコードのステータスを一括で更新できたら便利だと思いませんか？ 標準機能では一つずつ操作する必要がありますが、JavaScriptを活用することで一括操作が可能になります。 本記事では、選択した複数行のステータスを一括で変更できる便利なカスタマイズをご紹介します。 反映イメージ デモサイトはこ...
ナレッジサイト
ログイン
一覧表で、複数レコードのステータスを一括で更新できたら便利だと思いませんか？ 標準機能では一つずつ操作する必要がありますが、JavaScriptを活用することで一括操作が可能になります。 本記事では、選択した複数行のステータスを一括で変更できる便利なカスタマイズをご紹介します。 反映イメージ デモサイトはこ...
アンケートを実施した際、回答が偏ってしまった経験はありませんか？ 本記事では、回答のバイアスを防ぐために選択肢の順番をシャッフルする方法を解説します。 反映イメージ デモサイトはこちら 上記デモサイトでは、リロードする度にシャッフルされます。 作業手順 処理コード PHPを使用するページには、以下の専...
選択肢のシャッフルは、アンケートの回答バイアスを防ぐために有効な方法ですよね。 しかし単純にシャッフルしてしまうと、「その他」や「特にない」といった選択肢まで途中に混ざってしまい、 回答者が混乱する原因になります。 本記事ではアンケート作成の第二弾として、特定の項目だけを末尾に固定するカス
本記事では、セレクトフィールドの選択内容に応じて★マークで視覚的に評価を表示するシステムの実装方法を紹介します。 評価システムを導入するだけで、ユーザーの選択内容が直感的に把握でき、入力体験の向上とエンゲージメント向上に寄与します。軽量で既存フォームに簡単に組み込み可能です。 ポイント:
一覧から詳細画面へ遷移するリンクが見づらいと思ったことはありませんか？ リンクをボタン化することで、ユーザーにとって直感的にわかりやすくなり、操作性（ユーザビリティ）の向上につながります。 本記事では、一覧機能の“裏ワザ”第七弾として、一覧の詳細画面リンクをボタン風にカスタマイズする方法
入力されたパスワード強度を視覚的に分かるUI 概要 ユーザーが入力するパスワードの強度をリアルタイムで視覚的にフィードバックするUIコンポーネントです。 強度メーターと条件チェックリストにより、ユーザーは安全なパスワードを直感的に作成できます。セキュリティ向上とUX改善に繋がり、会員登
本記事では、フォーム入力の進捗度を可視化するプログレスバーの実装方法を紹介します。 プログレスバーを設置するだけで、入力の現在地がひと目で分かり、離脱抑止と完了率向上に寄与します。軽量で既存フォームに簡単に組み込み可能です。 ポイント: 視覚的な進捗提示は入力ストレスの低減に有効 導入効
一覧機能では、初回アクセス時の表示件数はデフォルトで「10件」に固定されています。 しかし、ちょっとした工夫で「100件」や「1000件」など、任意の件数を最初から表示させることが可能です。 本記事では、一覧機能の“裏ワザ”第六弾として、初回アクセス時の表示件数を
一覧機能で「特定の日付」や「特定の値」「ログイン中のユーザー名」などが、最初から入力されていたら便利だと思ったことはありませんか？ 本記事では、一覧機能の“裏ワザ”第五弾として、一覧画面にアクセスした時点で検索項目に初期値をセットする方法をご紹介します。 反映イメージ ▶ デモサイトはこちら 上記の例で...
一覧機能の検索で、日時をカレンダーで指定できたり、チェックボックスをプルダウン形式に変えられたら便利だなと思ったことはありませんか？ 本記事では、一覧機能の“裏ワザ”第四弾として、検索項目の入力タイプを変更する方法をいくつかご紹介します。 ※本方法を適用するにはxslファイルを
SPIRALのフォームでエラーサマリーを表示するJavaScriptをご紹介します。 機能としてはエラーメッセージをカウントし内部リンクによってエラー位置に遷移するというシンプルなものですが、どこでエラーが起きたかを一目で把握でき、エラー位置までクリッ
一覧上でステータスを「未完了」から「完了」に更新することはよくあります。 ですが、「完了」にした後は「未完了」に戻せないようにしたい、と思ったことはありませんか？ 本記事では一覧機能の“裏ワザ”第三弾として、ステータスの値に応じて一覧編集モードを非活性にする方法を紹介します。 ※本方法
SPIRALからxの投稿を取得する方法。 概要 Webフォームから指定したX (旧Twitter) ユーザーIDの投稿を取得し、任意で指定したキーワードを含む投稿を絞り込んで表示するPHPツールです。 X、SPIRALとの連携を実現することで、キャンペーン等で応募者が指
APIを使用して一覧表からデータ更新時にメールを送信する方法をご紹介します。 概要 一覧表から一括でステータスの更新等を行うことはよくありませんか？ 単票と違って一括で更新できるので便利ですよね。 ただ、フォームを使用せず更新するためサンクスメールが使えない落とし穴があります。 即時で送る
データ行がないときに、一覧のヘッダーだけが表示されて「これを消したい」と思ったことはありませんか？ 本記事では一覧機能の“裏ワザ”第二弾として、データ行がないときに一覧のヘッダーを非表示にする方法を紹介します。 ※本方法を適用するには、xslファイルのソースを一部編集する必要があります。
一覧上で「完了」したものと「未完了」のもの、重要な項目などをひと目で区別したい場合があります。 本記事では一覧機能の“裏ワザ”第一弾として、値に応じて一覧項目の背景色を変える方法を紹介します。 ※背景色を変更するには、xslファイルのソースを一部編集する必要があります。編集前にはバックアップを取るこ...
フローティングラベルを使用してSPIRALのフォームの入力体験を向上させる方法をご紹介します。 フォームのデザインテンプレートも用意いたしましたので、ダウンロードして試してみてください。 フローティングラベルとは？実装するメリット まずはデモサイトを
フォームを入力するユーザーのPC、ブラウザの環境によってライトモードとダークモードを自動で切り替える方法をご紹介します。 デモサイトをご用意しました。 デモサイト フォームのデザインテンプレートも用意いたしましたので、ダウンロードして試してみてください。 ダークモー
View Transition APIを使用してSPIRALのフォームでスムーズなページ遷移をする方法をご紹介します。 View Transition APIとは View Transition APIはLPのような単一ページアプリケーションにおけ
SPIRALフォームにおけるメールアドレス入力欄にドメイン部分のサジェスト機能を追加する方法について紹介いたします。 はじめに メールアドレス入力欄にドメインのサジェスト機能を実装する方法として、以下の2種類の方法があります。 1. サジェストするドメインを全てソース内で管理