こんばんは爆  笑

 

気温の変化についていけない方のサッカー馬鹿ですゲロー

久々に髪を短く切ったのに、会う人から決まって言われる言葉は・・・

 

「真っ黒に焼けたね!」

 

まだ一人にしか「髪切った?」としか言われていませんえーん決してタ〇リさんではありません

 

 

さて、本日は開発でドハマりしたことを書きたいと思います!

 

皆様はplaceholderってご存知ですか??

ざっくり言うと、フォームなどの入力欄にあらかじめ記入されている薄い灰色のテキストのことですニコニコ

 

今回、Bootstrapを使ったDB開発をしており、ログイン画面作りたいなーと思いまして。

(これ使ってやろうと思いましてw)

 

会社のDominoはまだ、Bootstrapテーマがないバージョンのため

色々と準備が必要でしたガーン

過去のブログに手順を書いていますねーキラキラ

XPagesでBootstrap!

 

ということで、下準備を終わらせBootstrapのsigninのHTMLを流用しましたチョキ

赤枠は編集可能コントロールに変更し、青枠はいらないので削除

 

そして、IBM Championの御代氏のブログ「XPagesでplaceholderを実現してみる」を参考に

placeholderを設定していきます。

 

ID(Email)入力用編集可能コントロールの設定

 

Bootstrapのソースを確認すると、type="email"となっているので

すべてのプロパティにあるtypeのリストからemailを選択します。

 

 

 

パスワード入力用編集可能コントロールの設定

 

先ほどと同じようにすべてのプロパティにあるtypeのリストからpasswordを・・・ってありませんねびっくり

 

もしかして手入力??

ということで、直打ちしてやりましたw

 

保存して、レッツプレビュー♪

怒られてしまいましたw

なんかパスワードをtrueにしろって書いてありますね・・・

 

あ、これかひらめき電球

 

今度こそ保存して、レッツプレビュー♪

 

って出てこねぇーーーーーームキー

 

もしかして、何か特殊な設定がいるのかと思い、グーグル先生に聞いてみました虫めがね

以下のリンク先がヒットしましたグッ

 

Use placeholder attribute and password type in Xpages

 

英語読めないのでよくわからないですが、

スクリプトブロックコントロールを使って対象のClassのtypeを書き換えちゃう技(?)

 

以下のスクリプトブロックコントロールを追加します。

<xp:scriptBlock>
    <xp:this.value><![CDATA[XSP.addOnLoad(function(){
    dojo.query(".passwordInput").forEach(function(eachInput){
        dojo.attr(eachInput, "type", "password");
    });
});]]></xp:this.value>
</xp:scriptBlock>

 

「特定のタイプの入力(例:passwordInput)を明白にするstyleClassを設定します。」と

書いてあるので、CSSに「passwordInput」に対するスタイルを書き足します。

 

 

 

パスワードに追加した編集可能コントロールのStyleClassに追記します。

注意点として、パスワードのチェックは不要なのでついていたら外します。

 

今度、今度こそ保存して、レッツプレビュー♪

 

出来たー\(^o^)/

 

いつもならここで「めでたしめでたし」で終わるのですが、

Bootstrapのテーマが選択できるDominoバージョンでも同じ設定がいるのか試してみました。

 

ID(Email)入力用編集可能コントロールの設定(typeも忘れずに)

 

パスワード入力用編集可能コントロールの設定

 

typeの項目には・・・追加されてませんねショボーン

 

 

懲りずに直打ちしてやりましたw

 

保存して、レッツプレビュー♪

 

期待通りのエラーww

 

ということで、パスワードにチェックを入れましたグッ

 

保存して、レッツプレビュー♪

 

どうせ、例のスクリプトブロック追加しないとダメなんでしょニヤリ

 

 

・・・って出来とるやーんゲロー

 

やはりDomino内部で持っているBootstrapテーマはXPagesを考慮していることをシミジミ実感キョロキョロ

(早く会社のDominoにFP当てたいな照れ

 

 

ということで、Dominoのバージョンは常に最新にしておかないと

便利な機能の恩恵も受けれないというのがわかりましたキラキラ

 

今日はこの辺で・・・

 

 

あでゅーバイバイ