ブログ

2020/04/06
【プリザンター】 第38回)プレースホルダー(テキストボックス内の説明表示)の変更方法

プレースホルダーとは

こんにちは、CCS田中です。

プレースホルダーをご存知でしょうか?
テキストボックスの入力前に薄い灰色などで記載された文字列を見たことがあるかと思います。プリザンターでも入力前のテキストボックスに項目名が表示されており、これがプレースホルダーです。
プリザンターでは、既定で項目名が入るようになっていますが、あまり意味がありません。ここには何を入力すればよいかを記載して置いたり、注意事項を記載しておくと便利です。標準機能では単純にこの部分を変えられないため、スクリプトを使って変更します。

方法については次に説明します。

プレースホルダーを変更するスクリプト

それではスクリプトを作成します。
以下の手順で設定を行ってください。

前提条件として、記録テーブルに項目としてメールアドレスを入力するための項目(種類は「説明A」)を作成しておいてください。
このメールアドレスのテキストボックスのプレースホルダーに「例:username@sample.com」と表示させるようにします。

1.対象のテーブルを開きます。
2.上記メニューから、[管理]→[テーブルの管理]をクリックします。
3.[スクリプト]タブをクリックします。
4.[新規作成]ボタンをクリックします。
5.タイトルに「プレースホルダー」等を入力します。
6.以下のスクリプトをスクリプト欄に入力します。
7.出力先の「全て」のチェックを外し、「新規作成」、「編集」にのみチェックを入れます。
8.[変更]ボタンをクリックします。
9.[スクリプト]タブに戻り、[更新]ボタンをクリックします。

ここまでで、設定は完了です。
対象テーブルを開き、新規作成をクリックし、メールアドレスのテキストボックスに指定したプレースホルダーが表示されていることが確認きます。

記載するスクリプト


$p.events.on_editor_load = function() {
$('#Results_DescriptionA').attr("placeholder","例:username@sample.com");
} 


まとめ

さて、いかがでしたか?

今回はプレースホルダーの変更ということで、変更したいが方法が分からない、といった方には参考になったかと思います。利用者から見てわかりやすいフォームにするために、このプレースホルダーの変更を活用してみてください。

導入の支援、スクリプト開発などでお困りの場合は、当社で支援もいたします。

☆☆ブログ内容への質問や追加説明をご希望の方は
【問い合わせフォーム】 こちら からお気軽にお問い合わせください☆☆

PAGE TOP