Parllet（個人作成Web家計簿アプリ）の家計簿入力改修－３：sakashushuの取りあえずブログ：So-netブログ

	ブログをはじめるログイン

Parllet（個人作成Web家計簿アプ.. ｜Parllet（個人作成Web家計簿アプ.. ブログトップ

Parllet（個人作成Web家計簿アプリ）の家計簿入力改修－３　[公開アプリ] [編集]

※ 注意！　このエントリは ブログラミング（ブログを書きながらプログラミング）です。筆者がポストした時には気づいていない誤り等が後から発覚する恐れがあります。（過去の事例：2014年 1/4 の誤りに 1/9 に気づいて訂正、等 ^^; ）

こんばんは。

もったいない星人のくせに最近物欲が強くなってる気がしてる @sakashushu です。

Parllet（個人で作成・公開しているアルファ版のWeb家計簿）の、5/15 にポストした改修案に沿ってのブログラミング（ブログを書きながらプログラミング）は 5/16 に開始して今回が３回目。

引き続き行ってまいります。

スポンサードリンク

■ ざっくり環境

OS：Windows 7 Home Premium
Play Flamework：1.2.4
ブラウザ：IE 11.0
Github公開リポジトリのCommitバージョン（スタート時点）： https://github.com/sakashushu/Parllet/tree/258d5e0f5f8c326566e83a7cb8578c333902afae

■ 現状

前回、Play Framework の validation をそのままフロント側に返し、z.validation.errors[0].key としてエラーのあった項目が取得できることが分かりました。

今回はこれを使ってエラー処理を書き足していくことになります。

いつものように体当たりでブログラミング（ブログを書きながらプログラミング）していきます。

■ 体当たり開始

前回のエラーパターンでは、取得できたのが "record.handling_mst" で、これを元にして画面上には項目名の "取扱（実際）" を表示させることになります。

Parllet では、使っているテーブルの項目の名称を表示するのに、基本的には Parllet/conf/messages.ja から引っ張ってくるようにしています。

項目 handling_mst で言うと以下。

handling_mst=取扱（実際）

html ファイル内で "&{'handling_mst'}" と記述すれば "取扱（実際）" が表示されますが、javascript 内で hancling_mst の部分が動的に変わるとなると、その記述法は使えません。

以前もこういう感じのことがやりたかったけど、解決策が見つからずにその時はあきらめました。

リベンジも兼ねて、「play framework messages javascript」で検索！

i18n
ローカライズされた Javascript メッセージを外部化します。ローカライズされたメッセージは i18n() 関数を使うことで JavaScript から利用することができます。

conf/messages ファイルに訳語を定義してください。
hello_world=Hello, World !
hello_someone=Hello %s !
テンプレート (またはレイアウト) ページにメッセージを取り込んでください:
#{i18n /}
そして JavaScript からキーを使って検索してください:
alert(i18n('hello_world'));
alert(i18n('hello_someone', 'John'));
via: 組込みテンプレートタグ - Play Framework

・・・・・。

思いっきり公式ドキュメントにありましたね・・・。

ま・・前の時は検索ワードが、わ・・悪かったのかな～（汗）。

まあ、とにかくこれで、項目名は取れますね。

最終的にはダイアログの先頭位置に表示しますが、まずは今のアラートに表示してみます。

Parllet/app/views/dialogFrmUpdRec.html に以下のように追記（太字の部分）

#{include 'subCategory.html' /}
#{i18n /}

（中略）

function openDialogFrmUpdRec(pDfurRec) {

    （中略）

    jQuery(function() {

        （中略）

        buttons["&{'insupd.save'}"] = function() {
            var bValid = true;

            （中略）

            if (bValid) {

                （中略）

                jqxhrUpdRec
                .done(function(z) {
                    switch (z.intRslt) {
                        case 0:
                            intRslt = 1;
                            jQuery('#dialog-updRec').dialog("close");
                            break;
                        case 99:
                            var vld = z.validation.errors[0],
                                strKey = vld.key.replace('record.', '');
                            alert(i18n(strKey)+"は"+z.strErr);
                            break;
                        default:
                            strErrMsg += " result Error";
                            alert(strErrMsg);
                    }
                })
                .fail(function() {
                    strErrMsg += " Failed";
                    alert(strErrMsg);
                });
            }

        }
    });

    （中略）

}