跳到主要內容

JQuery Mobile 在 ASP.NET 下使用 Pages 完成多頁面方法

WebForm 專案中使用 JQuery Mobile  有時希望在一個程式頁面下 .aspx 將不同頁面寫在一起，一來避免程式頁面越來越多，另外維護相關程式碼也較方便，之前透過 CSS  display 隱藏其它頁面元件，程式中常要判斷何時要顯示又何時隱藏，好不累人。之前知道 Pages 可用於多個頁面，但在 ASP.NET 下始終沒有找到解決的方法。好在最後仍不負眾望(其實只有我本人)試出下列方法，令人感動 T _ T，那就趕快記下來吧..

在 Site.Master.aspx 頁面中加入兩個頁面(FirstPage & SecondPage)
<body>
    <div data-role="page" id="FirstPage">
        <form runat="server">
             <asp:ScriptManager runat="server">
                <Scripts>
                ...
               </Scripts>
            </asp:ScriptManager>
            <head id="hd" ... >
            ...
            </head>
            <div class="container body-content ui-content" data-role="main">
             <asp:ContentPlaceHolder ID="MainContent" runat="server">
                </asp:ContentPlaceHolder>
            </div>
            <footer id="ft" ... >
            </footer>
             <div data-role="page" id="SecondPage">
        <form runat="server">
             <asp:ScriptManager runat="server">
                <Scripts>
                ...
               </Scripts>
            </asp:ScriptManager>
            <head id="hd2" ... >
            ...
            </head>
            <div class="container body-content ui-content" data-role="main">
             <asp:ContentPlaceHolder ID="MainContent2" runat="server">
                </asp:ContentPlaceHolder>
            </div>
            <footer id="ft2" ... >
            </footer>
</body>

在要寫入多個頁面的 aspx 中加入 Content (ID要同 Site.Master 中頁面所定義的哦)


<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="TestFunction.aspx.cs" Inherits="HonSec.AP.eTradeWebMobileSoltion.MapServerPos" %>
...
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <p><a href="#SecondPage">Here is the First Page ^ ^ </a></p>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent2" runat="server">
     <p><a href="#FirstPage">Here is  the Second Page ^ ^ </a></p>
</asp:Content>
標籤：

留言

張貼留言

這個網誌中的熱門文章

C# 中 List 複製內容到另一個 List 的幾種方法

簡單又實用 ^ ^ * 第一種透過 .ToList( ) 方法:  List<string> List1 = new List<string>();  List<string> List2 = new List<string>();  List1.Add("A");  List1.Add("B");  List1.Add("C");  List1.Add("D"); List2 = List1.ToList( ); * 第二種方式在建立物件時複製前一個 List  List<string> List1 = new List<string>();  List1.Add("A");  List1.Add("B");  List1.Add("C");  List1.Add("D"); List<string> List2 = new List<string>(List1); * 第三種方法新的List 中使用 AddRange( ) 方法  List<string> List1 = new List<string>();  List<string> List2 = new List<string>();  List1.Add("A");  List1.Add("B");  List1.Add("C");  List1.Add("D"); List2.AddRange(List1); 另可使用 List1.GetRange(Start, End) 來複製不固定大小(但不包含End)的內容
張貼留言
閱讀完整內容

無效的回傳或回呼引數。已在組態中使用 或在網頁中使用 <%@ Page EnableEventValidation="true" %> 啟用事件驗證

寫手機網頁 使用 Client 端的 jquery mobile 時 button 都會比較長，但改用 asp::Button 時發現按鈕大小卻變了，W3C 建議使用 jquery mobile Button 時，儘量使用<a href="#" data-role="button" > ，因此改用 asp::LinkButton 後果然解決了 Button 長度問題，只可惜按下去後，依然有點淚流滿面如下。後來拜求 google 大大，找到了原因及解法如下: 開啓了資料回傳安全驗證功能(EnableEventValidation 為 true)，導致錯誤訊息產生。如果必須要驗證資料，則必須使用 ClientScriptManager.RegisterForEventValidation 註冊控制項或直接在頁面.aspx上端 <%Page ... EnableEventValidation = "false"> ，那如果全部頁面都不想驗證，那請在 web.config 下找到 <configuration>      <system.web>       <pages  enableEventValidation ="false" >        ....       </page>       .... </configuration> 嗯  博大精深  ^^ 收工回家去............................
張貼留言
閱讀完整內容

SASS基本語法範例

最近想在 ASP.NET 專案使用 SASS 取替自己寫了很久的 CSS(畢竟少打很多字也有更多的彈性)，突然才發現 SASS 語法又忘了一大半，不過在 ASP.NET 上好像.sass 不支援 intellisense ，有人會的話也請不吝賜教，這裡留個簡單例子來提醒快半腦殘的自己^^。言歸正傳，SASS 其實最終需要再解析回 CSS 但在寫法上不但支援 SCSS @變數，利用 tab 嵌入以減少使用大括號的寫法，更是讓 SASS 成為攻城獅學會後再也無法接受CSS 的一大要素。下面例子為一個簡單的 TabSelect 並讓其具有 hover 的特性，游標指到時字體Color 改為黃色並向上 1em 顯示.. HTML: <ul>   <li>Hello1</li>   <li>Hello2</li>   <li>Hello3</li>   <li>Hello4</li>   <li>Hello5</li> </ul> SASS: body,html   background: black ul   display: flex   list-style: none   align-items: center   align-content: center   vertical-align: middle   margin: 50px   padding: 12px   width: 850px   height: 150px   li         width: 150px     margin: 5px     padding: 12px     text-align: center     &:nth-of-type(1),     // & 指 parent，這裡就是指 li     &:nth-of-type(2),     &:nth-of-type(3),     &:nth-of-type(4),     &:nth-of-type(5)         color: blue    
1 則留言
閱讀完整內容