msls で LightSwtich らしい MessageBox を利用する

LightSwitch HTML クライアントのアプリケーションをカスタマイズするには、クライアント側は当然 jQuery / JavaScript を使うことになります。
当然 JavaScript の標準の alert も使えます。

  1. myapp.Browse.ShowMessage_execute = function (screen) {
  2.     alert(“標準の alert です”);
  3. };

image

まあ、いいんですけどね。

msls (=Microsoft LightSwitch : LightSwitch 用の JavaScript フレームワーク) に MessageBox が用意されているので、それを使うと LightSwitch っぽい見た目になります。

  1. myapp.Browse.ShowMessage_execute = function (screen) {
  2.     msls.showMessageBox(“msls の showMessageBox です”);
  3. };

image

MessageBox 周りの影の付き具合がいい感じです。

Yes / No なども取れます。

  1. myapp.Browse.ShowMessage_execute = function (screen) {
  2.     var result = msls.showMessageBox(“選択してください”, { title: “msls.showMessageBox の例”, buttons: msls.MessageBoxButtons.yesNo });
  3.     result.then(function (val) {
  4.         if (val == msls.MessageBoxResult.yes)
  5.             msls.showMessageBox(“「はい」が選択されました”);
  6.         else
  7.             msls.showMessageBox(“「いいえ」が選択されました”);
  8.     });
  9. };

imageimageimage

ノンコーディングでも基本的なアプリケーションとして動作しますが、ちょっとコードを追加するだけで見た目がよくなりますね。

もちろん jQuery Mobile の ThemeRoller の結果もちゃんと MessageBox に反映されます。
(現時点では LightSwitch が対応しているのは jQuery Mobile 1.3.0 です。ThemeRoller でのバージョン選択を忘れずに)

image

広告
カテゴリー: LightSwitch タグ: , パーマリンク

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中