这是一篇关于easyui配合ajax使用的文章，顺带介绍angularjs的使用以及让你感受到angularjs的威力。网上对于ajax 的文也是多如牛毛 。我就不直接从那种原生的httpxmlrequest 对象的js 写起了哈。看那种东西也存粹是了解 高层的东西是怎么来的 原理是啥真正做的时候写那种东西 不是扯淡么 你叼你技术牛逼整站的代码你全用那种写。html js 这种东西最开始设计出来就没考虑周全就是坨屎。还好现在有各种框架 可以帮助我们更容易的把这坨屎做的更美味。也还好由于互联网事业如日中天 的推动 让浏览器端的这堆东西正在往统一规范的方向发展。
我们来建立一个webform页面 HelloAjaxNet.aspx。先说下ajax 这里我使用网上流传甚广的那个AjaxPro.2.dll 他的网站是 这是一个个人作品 ，很好用。
本来新的asp.net 里自带了服务端方法用webmethod 属性声明 客户端pagemethods访问的方式 ，各种对象也可以json数据化 ，功能跟上面一样的。微软自带的是aspx的codebehind 代码方法 一定要加static ，至于webconfig 在新版的vs2013开发环境下无须配置 如果是老的则新建ajax网站项目则webconfig自动弄好了然后服务端页面载入事件中 ScriptManager.GetCurrent(Page).EnablePageMethods = true; 客户端 必须有runat=server 的form 和 <asp:ScriptManager runat="server"> </asp:ScriptManager> 然后客户端就可以pagemethods 的方式访问。
我始终还是认为上面那个更好用 。关于他的原理我就不多说了 ，通过页面载入时注册服务端对象 ，然后生成的html页面上就多了这么几句
<script type="text/javascript" src="https://www.jb51.net/ajaxpro/prototype.ashx"></script> <script type="text/javascript" src="https://www.jb51.net/ajaxpro/core.ashx"></script> <script type="text/javascript" src="https://www.jb51.net/ajaxpro/converter.ashx"></script> <script type="text/javascript" src="https://www.jb51.net/ajaxpro/WebApplication.StudentsInfo,WebApplication.ashx"></script> <script type="text/javascript" src="https://www.jb51.net/ajaxpro/WebApplication.Grad,WebApplication.ashx"></script> <script type="text/javascript" src="https://www.jb51.net/ajaxpro/WebApplication.NewFolder.HelloAjaxNet,WebApplication.ashx"></script> <script type="text/javascript" src="https://www.jb51.net/ajaxpro/WebApplication.DataEntity,WebApplication.ashx"></script>
为是什么呢 为的是引用一段js文件 ajaxpro/WebApplication1.NewFolder2.HelloAjaxNet,WebApplication1.ashx
然后你就明白了噻 这段客供你进行客户端js调用的脚本 是服务端自动生成的 跟你 服务端的名字一模一样 然后你就可以貌似像在客户端回调服务端方法样的 没什么神奇的，我们主要就是想利用他的这个特性和json化数据的方便之处 来实现客户端服务端数据的无缝传递。
关于json数据的序列化 要是以前就只有利用外部json库 或者微软自带的来进行手动解析：
服务端：
public string ServerProcerMethod(string stu) { //System.Web.Script.Serialization.JavaScriptSerializer jsSerializer = new System.Web.Script.Serialization.JavaScriptSerializer(); //StuInfo s= jsSerializer.Deserialize<StuInfo>(stu); System.Web.Script.Serialization.JavaScriptSerializer jsSerializer = new System.Web.Script.Serialization.JavaScriptSerializer(); List<StuInfo> s = jsSerializer.Deserialize<List<StuInfo>>(stu); if (s != null && s.Count > ) { StuInfo stu= s[]; StringBuilder sb = new StringBuilder(); jsSerializer.Serialize(stu, sb); return sb.ToString(); } else return null; }
客户端：
//javascript 字符串转json对象： var obj = JSON.parse(str); //javascript json 对象转字符串： JSON.stringify(obj);
关于AjaxPro.2.dll 和ajax.dll的关系 ，网上说他们不一样 其实压根就是一个人搞的吧 我擦 。请在上面网站下载ajaxpro 这个才是完善的版本
引用dll文件后需要配置webconfig httphandler 作用就是让 上面的ashx请求转到我们的 ajaxpro代码 ，进而让我们的客户端js直接调用服务端方法调用成功。
<system.webServer> <directoryBrowse enabled="true"/> <handlers> <add verb="*" path="*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro."/> <!--<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />--> </handlers> </system.webServer>
然后其他的我就不多说了哈待会直接看服务端代码。
easyui 你就可以理解为一堆扩展了的控件。就像jquery一样 你把js对象 原生的html控件用他的东西一包 然后就可以点得出他一些为你写好的方法 帮助你方便的处理数据。并且还有默认的还可以的控件外观，这点对于做企业管理类软件来说 还是真心不错的，做其他的就只能呵呵了。下载easyui的文件 放到项目中 并引入easyui 相关js和样式文件 还有jquery：