[解決済み] 画面作成イベントでshowTabを呼び出す
質問
LightSwitch HTMLを使用していますが、複数のタブを持つ画面があり、画面の「作成」イベントで、いくつかのロジックに基づいてタブの1つを表示したいのです。
myapp.MyScreen.created = function (screen)
{
if (/* some logic */) {
screen.showTab("TabOne");
} else {
screen.showTab("TabTwo");
}
}
しかし、これでは画面を開くとエラーが出ます。
TypeError: Cannot read property 'pageName' of undefined.
この現象に遭遇した方、回避策を見つけた方はいらっしゃいますか?
ありがとうございました。
解決方法は?
画面のcreatedイベントでshowTab APIコマンドを使用するには、画面が完全に表示されるまで、その使用を遅らせる必要があります。
これを実現するには、jQuery mobileの ページ変更イベント (LightSwitch HTML ClientはjQuery mobileを使用しているため)および setTimeoutでタイムアウトを0にする (ローディング画面がレンダリングされるまでshowTabを遅延させるため)。
以下は、この方法を用いた例の修正版です。
myapp.MyScreen.created = function (screen) {
$(window).one("pagechange", function (e, data) {
setTimeout(function () {
if (/* some logic */) {
screen.showTab("TabOne");
} else {
screen.showTab("TabTwo");
}
});
});
};
より高度な代替案とともに、このアプローチについては、次の投稿に対する私の回答でより詳細に説明しています。
しかし、この方法は、最初の画面が完全に表示されるまで showTab を遅らせることに基づいているため、デフォルトのタブから showTab メソッドで表示されるタブへの移行が顕著になります。
この顕著な移行を避けたい場合は、LightSwitch ライブラリをカスタマイズして、標準の 表示画面 メソッドを使用します。この新しいオプションにより、画面を表示する際に希望のタブページ名を指定することができます。
この追加オプションを導入したい場合は、HTML クライアントの default.htm ファイルを以下のように変更して、LightSwitch ライブラリの最小化されていないバージョンを参照する必要があります(ライブラリ スクリプト参照の末尾から .min を削除します)。
<!--<script type="text/javascript" src="Scripts/msls-?.?.?.min.js"></script>-->
<script type="text/javascript" src="Scripts/msls-?.?.?.js"></script>
上の行のクエスチョンマークは、使用している LightSwitch のバージョンに関連しています。
次に、Scripts/msls-?...js ファイル内の showScreen 関数を宣言している部分を探し、以下のように変更してください。
function showScreen(screenId, parameters, options) {
//return msls_shell.showScreen(
// screenId, parameters, null, false,
// options ? options.beforeShown : null,
// options ? options.afterClosed : null);
return msls_shell.showScreen(
screenId, parameters,
options ? options.pageName : null,
false,
options ? options.beforeShown : null,
options ? options.afterClosed : null);
}
そして、この新しいpageNameオプションは、以下のように標準的な画面表示方法のいずれかで使用することができます。
msls.application.showScreen("MyScreen", null, { pageName: "TabOne" });
// or
myapp.showScreen("MyScreen", null, { pageName: "TabOne" });
// or
myapp.showMyScreen(null, { pageName: "TabOne" });
この結果、デフォルトのタブから目立たず、目的のタブに画面が表示されるようになりました。
関連
-
[解決済み】iframeの背景色を変更する問題
-
[解決済み】html文書に縦の空白を挿入するには?
-
[解決済み】iframeの高さを100%にする方法【重複】。
-
[解決済み】divの高さを画面の残りスペースで埋めるようにする
-
[解決済み] will-change' や translateZ() ハックは 'transition: height' のパフォーマンスを向上させるか?
-
[解決済み] textareaのresizableプロパティを無効にするにはどうしたらよいですか?
-
[解決済み] ページを再読み込みせずにURLを変更するにはどうすればよいですか?
-
[解決済み] 画面サイズ、現在のウェブページ、ブラウザウィンドウのサイズを取得する
-
[解決済み] HTMLのid属性に有効な値は何ですか?
-
[解決済み] How can I set the default value for an HTML <select> element?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】ラジオボタンの代わりに画像を使用する
-
[解決済み】Telegramマークダウンの構文。太字 *と* イタリック?(2018年9月)
-
[解決済み] div要素間の空白を削除する方法
-
[解決済み] IE=edge,chrome=1というのは今でも有効なのでしょうか?
-
[解決済み] bodyタグに追加された奇妙なiframe、`rufous-sandbox`について
-
[解決済み] HTML5 Canvas 要素でカスタムフォントを使用するにはどうすればよいですか?
-
[解決済み] HTML Divのボーダーが表示されない
-
[解決済み] デフォルトで空白を選択
-
[解決済み] Bootstrap 4 の mr-auto が正しく動作しない。
-
[解決済み] setTimeout(fn, 0)が役に立つことがあるのはなぜですか?