使用jQuery轻松实现埃阿斯的实例代码

生成Asp .净手动音量调节框架后，已经包含了jQuery脚本，相关环境设置可参看我的另一篇文章：Asp .净手动音量调节实例。这里，我们仍然借助实例中的环境。在生成的框架中的剧本文件夹中已经可以看到jQuery的脚本。我们在TestModel.cs中创建一个函数，以取得Json数据，仍然使用Tets表，包含两个字段：Id和名字。复制代码代码如下： //JsonDataArray公共静态数组GetJsonArray(字符串名称){数组数据=null尝试{数据=(从testDb.test中的c开始，其中包含(名称)选择新的{ c.id，c.name }).ToArray()；} catch(ArgumentNullException AE){ }返回数据；} Json数据，简单来说，即使用键值数组形式的数据。然后按默认选项创建一个控制器，生成的控制器只有一个方法：索引()。我们再创建一个方法，以供jQuery调用。完成的代码如下：JQueryController.cs。注意：在MVC2.0中默认情况中禁止jQuery调用服务器数据，所以必须在代码中增加访问权限：JsonRequestBehavior .允许获取。复制代码代码如下：使用系统；使用系统。集合。通用；使用系统Linq .使用系统网络.使用系统网络。手动音量调节使用MvcWeb .模型；命名空间MvcWeb .控制器{公共类JQuery Controller : Controller {////GET:/JQuery/公共操作结果Index(){ return View()；} public JsonResult FindByName(字符串名称){返回Json(TestModel .GetJsonArray(名称)，JsonRequestBehavior .允许get)；} } } 然后在索引()上按右键，按默认选项生成一个视图，可在视图/JQuery看到生成的代码：Index.aspx，生成的代码非常简单，我们再插入脚本代码，完成如下：复制代码代码如下： %@页面标题='语言='C# '母版页文件=' ~/视图/共享/网站。主"继承="系统网络。MVC。view page“% ASP :内容ID='content 1 '内容placeholderid=' title content ' runat=' server ' jquery/ASP :内容ASP :内容ID='content 2 '内容placeholderid=' main content ' runat=' server '脚本src='http 3360././Scripts/jquery-1。4 .1 .js ' type=' text/JavaScript '/script脚本语言=' JavaScript ' type=' text/JavaScript ' $(文档)。ready(function() { $('#updater ')).hide()；$('#dataHead ').hide()；$('#linkFind ').点击(功能(事件){事件。prevent default()；$('#dataHead ').show()；$(“# updater”).show()；$.getJSON('/JQuery/FindByName/'，{ name: $('#textSearch')[0]).值}、函数(数据){ $('#testList div ').移除();$.每个（数据，函数(I，item) { $('#testList ').追加(“div”项。id为“”的项目。名称'/div ')；});});$(“# updater”).hide()；});});/脚本氘使用jQuery实现埃阿斯实例/h2 div id='查询%=Html .文本框(“文本搜索”)% a href=“#”id=“链接查找”搜索/a span class=' update ' id=' updater '正在加载./span/div ID=' dataHead ' ID Name/div div ID=' testList '/div/asp3360内容运行项目，在文本框中输入“t”，按"搜索",在页面没有刷新的情况下显示出查询到的数据，如下图

另外，在埃阿斯开发中，还可以使用埃阿斯的基础函数$.创建交互式、快速动态网页应用的网页开发技术进行调试，当出现错误时，可以打印错误信息。例如，对上述的调用可以用下面代码调试：复制代码代码如下：脚本语言=' JavaScript '类型=' text/JavaScript ' $(文档)。ready(function() { $('#linkFind ')).点击(功能(事件){事件。prevent default()；var handleData=function(data){ alert(' success : ' data)；} var handleErr=function(e){ alert(e . response text)；} $.ajax({ type: 'get '，url: '/Jquery/FindByName '，data: 'name=t '，success: handleData，错误： handleErr })；});});/script