0

假设我必须使用 ASP 母版页并在其中设置 Kendo UI Mobile 布局，同时使用<asp:contentplaceholder>加载 aspx 页面内容。为了使其正常工作，我尝试了以下方法（在此处剥离标签属性以提高可读性）：

母版页文件：

<html>
<head></head>
<body>
    <form>
        <asp:contentplaceholder></asp:contentplaceholder>    
    </form>

    <!-- Master Layout -->
    <div data-role="layout" data-id="mMasterLayout">
        <header data-role="header">
        </header>
        <footer data-role="footer">
        </footer>
    </div>

    <!-- load scripts here (jquery, kendo, etc.) -->

    <script>
        var app;

        $(document).ready(function () {
            app = new kendo.mobile.Application(document.forms, {
                layout: "mMasterLayout"
            });
        });
    </script>
</body>
</html>

使用母版页文件的其他页面：

<asp:Content>
    <!-- View -->
    <div data-role="view">    
        <!-- Content -->
        <div data-role="content">
            .
            .
            .
        </div>
    </div>
</asp:Content>

因此，检查 DOM 我没有发现任何错误，并且 Kendo 正在正确渲染。问题是，我的屏幕是空白的（只看到正文背景颜色）。在 DOM 中，要显示的预期视图实际上是可见的。

有人有什么想法可以帮忙吗？我觉得针对 Kendo 的表单容器来呈现我的视图是罪魁祸首，但我不确定。我还尝试继承 body 标签的宽度和高度，看看是否有帮助，但它什么也没做。

另外，请注意我必须让它以这种方式工作，因为解决方案没有设置为 MVC，所以没有 MVVM 或类似的东西是可能的。

我正在使用 Kendo UI Mobile 和 JQuery 的最新版本。谢谢！

更新：

在我的母版页文件中硬编码标签的固定高度form确实会产生我想要的视图内容。我想剩下的问题是..将此表单标签扩展到文档正文高度的最佳方法是什么..

4

1 回答 1

0

找到了我自己的解决方案 - 将以下 CSS 属性添加到母版页文件：

html { height: 100%; }

于 2013-01-18T23:03:12.703 回答