8

この質問は次のようなものです: ASP.NET MVC アプリの jQuery Mobile レイアウトですが、すべてのビューでヘッダーとフッターを再入力するのは効率的ではないと考えているため、ベスト プラクティスを見つけようとしています。もっと良い方法があるはずです。

したがって、ASP.NET MVC 共有レイアウト ビュー (別名 master pages ) をビュー/部分ビューで動作させるための最良の方法を探しています。

MVC レイアウトから JQuery モバイル ページをレンダリングするには、次の 2 つの方法があります。

1) 標準レイアウト形式:

 <!DOCTYPE html> 
<html> 
    <head> 
    <title>Page Title</title> 
        ...
</head> 
<body>
<div  data-role="page"> 
    <div  data-role="header">...</div> 
    <div  data-role="content">@RenderBody()</div> 
    <div  data-role="footer">...</div> 
</div>
</body>
</html>

私が学んでいるように、私は問題に遭遇し始め、後でそのマスター支払い内に他の「ページ」を実際にロードできないことを知りました. 継承されたすべてのビューは、そのマスター Jquery モバイル ページの一部である必要があります。悪い。2)

    <!DOCTYPE html> 
<html> 
    <head> 
    <title>Page Title</title> 
        ...
</head> 
<body>
<div  data-role="page">     
     @RenderBody()
</div>
</body>
</html>

これは機能しますが、ビューごとにヘッダーとフッターを再入力する必要があることも意味します。

皆さん、ご意見をお聞かせいただけますか？レイアウトに複数のJquery Mobile「ページ」をロードできるようにするための最善の方法は何ですか?どこでもヘッダー/フッターを繰り返す必要はありませんか? ...ある時点で変更する必要がある場合はどうなりますか?

前もって感謝します。

4

1 に答える 1

2

同様の状況で私が行ったことの 1 つは、「ページ」div のないマスター レイアウトを作成することです。

<!DOCTYPE html> 
<html> 
    <head>...</head>
    <body>
        @RenderBody()
    </body>
</html>

次に、ヘッダー/フッターを含めることができるマスター レイアウトから継承するレイアウト ページを作成します。

@{
    Layout = "~/Views/Shared/_LayoutMobileMaster.cshtml";
}
<div data-role="page" data-theme="b" position="fixed">
    <div data-role="header" data-position="fixed" data-theme="b" id="contentHeader">
        <a id="backBtn" data-direction="reverse" data-icon="back" class="ui-btn-left">Back</a>
        <h1>@ViewBag.Title</h1>
        <a id="logoutBtn" data-icon="gear" class="ui-btn-right">Logout</a>
    </div>
    <div data-role="content" data-theme="b">
        @RenderBody()
    </div>
</div>

もちろん、各ページに異なるヘッダー/フッターがある場合、これはあまり実用的ではありません。中間レイアウトを廃止して、ヘッダー/フッターを各ビューに直接配置することもできます。しかし、各セットが特定の外観を持つ必要がある複数のページの異なるセットがある場合、これは非常に便利だと思います.

于 2012-07-26T14:16:48.137 に答える