MagicAjax使用心得

我想 大家對MagicAjax都很瞭解了吧，我再把MagicAjax的使用說一遍：

1.到 http://www.magicajax.net/ 下載最新的DLL組件以及源碼包；

2.配置 Web.config:

<configSections>
       <section name="magicAjax" type="MagicAjax.Configuration.MagicAjaxSectionHandler, MagicAjax" />
</configSections>

 

<magicAjax scriptPath="~/Script" outputCompareMode="HashCode" tracing="false">
    <pageStore mode="NoStore" unloadStoredPage="false" cacheTimeout="5" maxConcurrentPages="5" maxPagesLimitAlert="false"/>
</magicAjax>

 

<pages>
      <controls>
              <add tagPrefix="ajax" namespace="MagicAjax.UI.Controls" assembly="MagicAjax"/>
      </controls>
</pages>

 

 <httpModules>
      <add name="MagicAjaxModule" type="MagicAjax.MagicAjaxModule, MagicAjax" />
</httpModules>

3.在你需要用到MagicAjax的頁面頭部聲明：

<%@ Register TagPrefix="ajax" Namespace="MagicAjax.UI.Controls" Assembly="MagicAjax" %>

用AjaxPanle包含你要進行無刷新的控件；

<asp:Content runat="server" ID="LinkButton_Content" ContentPlaceHolderID="LinkButton_ContentPlaceHolder">
    <ajax:AjaxPanel runat="server" ID="AjaxPanle0">
        <uc7:MasterTemplate runat="server" ID="MasterTemplate1" />
    </ajax:AjaxPanel>
</asp:Content>
<asp:Content runat="server" ID="Menu_Content" ContentPlaceHolderID="menu_ContentPlaceHolder">
    <ajax:AjaxPanel runat="server" ID="AjaxPanel1">
        <asp:WebPartZone ID="WebPartZone1" runat="server" SkinID="WebPartZoneSkin">
            <ZoneTemplate>
                <uc4:Menu ID="Menu1" runat="server" SiteId="-1" ModuleCode="1000" Rows="1" Columns="10"
                    PanelWidth="100%" HrefCss="link2" SiteConfig="SiteCode" />
            </ZoneTemplate>
        </asp:WebPartZone>
    </ajax:AjaxPanel>
</asp:Content>

到此，所有的工作已經完成，你就可以完成無刷新了。。。簡單吧。。。哈哈。。。

注：

關於  Loading...  字體，有些人想改變成中文，這個當然可以實現，但是在Web.config裏面進行設置，會出現很多問題，譬如你頁面的編碼都亂了。那如何解決呢？

不要急，我們可以改變思維，用圖片來替代，如何？這個當然是可以實現的：

找到源碼包裏面的Script文件夾的AjaxCallObject.js文件，找到

function CreateWaitElement() ...{
    var elem = document.getElementById('__AjaxCall_Wait');
    if (!elem) ...{
        elem = document.createElement("div");
        elem.id = '__AjaxCall_Wait';
        elem.style.position = 'absolute';
        elem.style.height = 17;
        elem.style.paddingLeft = "3px";
        elem.style.paddingRight = "3px";
        elem.style.fontSize = "11px";
        elem.style.fontFamily = 'Arial, Verdana, Tahoma';
        elem.style.border = "#000000 1px solid";
        elem.style.backgroundColor = "DimGray";
        elem.style.color = "#ffffff";
        elem.innerHTML = '<img src="../Images/load.gif">';
        elem.style.visibility = 'hidden';
        document.body.insertBefore(elem, document.body.firstChild);
    }
    waitElement = elem;
}

把 elem.innerHTML = '<img src="../Images/load.gif">';  改成做好的圖片字樣就OK啦。。。