在屏幕创建事件中调用 showTab

Question

我正在使用 LightSwitch HTML，我有一个包含多个选项卡的屏幕，在屏幕 'created' 事件中，我想根据某种逻辑显示其中一个选项卡：

myapp.MyScreen.created = function (screen) 
{
     if (/* some logic */) {
         screen.showTab("TabOne");
     } else {
         screen.showTab("TabTwo");
     }
}

但是当我打开屏幕时这会引发错误：

TypeError: Cannot read property 'pageName' of undefined.

有没有人遇到过这个问题并找到了解决方法？

感谢您的帮助，

Answer 1

为了在屏幕的创建事件中使用 showTab API 命令，它的使用需要延迟到屏幕完全显示。

这可以通过使用 jQuery 移动设备 pagechange event (as the LightSwitch HTML Client uses jQuery mobile) and a setTimeout with a zero timeout 的组合来实现（延迟 showTab 直到呈现加载屏幕）。

以下显示了使用此方法的示例的修订版本：

myapp.MyScreen.created = function (screen) {
    $(window).one("pagechange", function (e, data) {
        setTimeout(function () {
            if (/* some logic */) {
                screen.showTab("TabOne");
            } else {
                screen.showTab("TabTwo");
            }
        });
    });
};

除了更高级的替代方法外，我对以下 post 的回答更详细地介绍了这种方法：

LightSwitch Tabbed screen in Browse template

但是，由于此方法是基于延迟 showTab 直到初始屏幕完全显示，因此它确实会导致从默认选项卡到 showTab 方法显示的选项卡的明显转换。

虽然稍微复杂一些，但如果您希望避免这种明显的转换，可以自定义 LightSwitch 库以在标准 showScreen 方法中引入一个新选项。这个新选项将允许在显示屏幕时指定所需的标签页名称。

如果您想引入此附加选项，您需要通过在 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" });

这会导致屏幕显示在所需的选项卡上，而不会从默认选项卡明显过渡。

在屏幕创建事件中调用 showTab

Call showTab in the screen created event

html

visual-studio-lightswitch

lightswitch-2013