將ASP.NET MVC佈局應用到Jquery.Mobile頁面的最佳實踐

這個問題接近於：jQuery Mobile layout in ASP.NET MVC app但我試圖找到最佳實踐，因爲我認爲在每個視圖中重新輸入Header和Footer效率不高。一定會有更好的辦法。將ASP.NET MVC佈局應用到Jquery.Mobile頁面的最佳實踐

所以，我正在尋找使ASP.NET MVC共享佈局視圖（又名母版頁）與我的視圖/部分視圖一起工作的最佳方式。

從閱讀周圍有兩種方法來呈現從MVC佈局jQuery Mobile的網頁：

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「頁面」，而不必在任何地方重複頁眉/頁腳，最佳方法是什麼？ ......我的意思是如果一個人在某個時候需要改變什麼？

預先感謝您。

來源

2012-07-25 Shenaniganz

有一件事我已經在類似情況下所做的是讓主佈局沒有「頁」分區：

<!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-26 14:16:48 Alejo

我不太明白擁有這個主佈局的意義。它沒有任何JQuery Mobile內容（如頁面指示）。您發佈的第二個佈局是您無論如何將用於您的頁面的佈局。這與標準的Layout-Content頁面場景有何不同？在我看來，我可能還會創建多個帶有視圖/標題的「佈局頁面」，並使用它們來繼承我的視圖。沒有理由擁有這個「主佈局」...或者我錯過了什麼？ – Shenaniganz 2012-07-26 16:45:15

基本上，這只是爲了方便，因爲我可以包含整個站點所需的所有腳本/樣式表，所以我不必將它們包含在每個頁面中。無論你在那裏放置頁面div還是在每個子佈局中都不應該有所作爲，真的。 – Alejo 2012-07-26 18:19:24

不知道是否有更好的方法，但這是我最終採取的路徑。謝謝 – Shenaniganz 2012-08-13 18:43:41

將ASP.NET MVC佈局應用到Jquery.Mobile頁面的最佳實踐

回答

相關問題