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啦。。。