浅谈AjaxPro.dll,asp.net 前台js调用后台方法

1、什么是Ajax

Ajax是异步Javascript和XML(Asynchronous JavaScript and XML)的英文缩写。"Ajax"这个名词的发明人是Jesse James Garrett,而大力推广并且使Ajax技术炙手可热的是Google。Ajax的核心理念在于使用XMLHttpRequest对象发送异步请求。

2、为什么使用

  • Ajax减轻服务器的负担。Ajax的原则是"按需取数据",可以最大程序地减少冗余请求,减轻服务器的负担。
  • 无需刷新页面,减少用户心理和实际的等待时间。特别是在读取大量数据时,不会像刷新页面那样出现白屏的情况,Ajax使用XMLHttpRequest对象发送请求并且得到服务器响应,在不重新载入整个页面的情况下,用Javascript操作DOM更新页面。因此在读取数据的过程中,用户所面对的不是白屏,是原来的页面内容(也可以加入一个"loading"的提示框让用户知道目前正在读取的数据),只有在数据接收完毕之后才更新社会相应部分的内容。这种更新是瞬间的,用户几乎感觉不到。
  • 带来更好的用户体验
  • 可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器负担,充分利用带宽资源,节约空间和宽带租用成本。
  • 可以调用外部数据
  • 基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。
  • 进一步促进页面呈现与数据的分离

3、Ajax应用场景

场景1:数据验证

场景2:按需取数据

场景3:自动更新页面

4、Ajax开发框架

  • JQuery
  • Ext
  • YUI
  • Qooxdoo
  • DWR(Direct Web Remoting)

目前该产品被加入到WebWork中,开源(Apache)。可以在Javascript代码中直接调用java方法的应用框架,可以把Javascript中的请求调用转递到java方法中并将执行结果返回给Javascript。

AjaxPro

AjaxPro是首家支持以各种方式通过javascript访问服务端.net的免费库,类似于SAJAX。它能把Javascript请求发送到.NET方法,服务端传回给Javascript,甚至包括串行化自定义类。其主要特点如下:

可以在Javascript中访问Session和Application数据;

缓存查询结果

免费使用源代码

所有类支持Javascript客户端返回数据,可以在Javascript中使用DataSet

使用HtmlControls组件访问和返回数据

页面无需重载,用事件代理(数据访问层)

因为只提供一个调用接口方法,所以服务端CPU占用非常少。

Magicajax

Magicajax以最简单的方式将Ajax功能整合到页面中,不需要修改ASP.NET控件,也不需要编写新的控件,更不需要撰写JAVASCRIPT,它有如下的特性:

应用配置简单,易于上手;

只用一个AJAXPANEL就实现Ajax功能,只要把需要无刷的控件放进AJAXPANEL就可以了。

Ajax功能和普通的POSTBACK可以共存于一个WEBFORM,MAGICAJAX处理模块只处理包含在AJAXPANEL中的控件的CALLBACK动作。

VIEWSTATE的内容对于POSTBACK和CALLBACK来说,都是可见的,因此,无论是CALLBACK产生的VIEWSTATE,还是POSTBACK产生的,都是可见的;

提供一个类似POSTBACK的CALLBACK的事件模型

支持IE和Firefox

Anthem.NET

和传统的Ajax技术相比,Anthem.NET有以下优点:

不需要任何技术升级,以前不会使用Ajax技术的人员,按照以往的编程方式就可以实现异步交互;

支持asp.net 1.1和asp.net 2.0

5、AjaxPro说明

本文档将使用AjaxPro.Net框架实现Ajax功能:在客户端异步调用服务端方法。AjaxPro.Net是一个优秀的.net环境下的Ajax框架,用法很简单,可以查阅相关资料,本文档以一个简单的实例讲述使用AjaxPro的几个关键点,本例实现一个简单的功能,服务器端将页面中输入的数字加1后的结果返回给客户端(注意,必须有AjaxPro包,即AjaxPro.dll文件,可以在VSS上下载)。

6、AjaxPro实例说明

6.1、添加AjaxPro.dll应用

2.1.1用VS打开项目,在其资源管理器中,右击引用,左击"添加引用",如图1_1所示

图1-1

2.1.2出现如图1_2所示的对话框,点击浏览,找到AjaxPro.dll文件所在的位置,双击AjaxPro.dll,然后点击确定。

图1-2

2.1.3在资源管理器的引用文件夹下,就可以看到AjaxPro了,说明添加引用成功,如图1_3所示。

图1-3

2.2、配置web.config

这一步的作用是保证客户端向"ajaxpro/*.ashx"的请求(POST和GET)都被AjaxPro.AjaxHandlerFactory拦截。

打开web.config文件,在<configuration><system.web>后添加以下代码,

<httpHandlers>

<addverb="POST,GET"path="ajaxpro/*.ashx"type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>

</httpHandlers>

如图2_1所示。

图2-1

2.3、添加服务端方法

2.3.1打开后台代码,在Page_Load方法体内加上如下代码,

AjaxPro.Utility.RegisterTypeForAjax(typeof(所在类的类名));

如图3-1所示。

图3-1

其作用是向客户端输出下面的代码:

<script type="text/javascript" src="/ch33/ajaxpro/core.ashx"></script>

<script type="text/javascript" src="/ch33/ajaxpro/ch33.Verify,ch33.ashx"></script>

2.3.2、添加数字加一的方法,首先在方法前加[AjaxPro.AjaxMethod],然后像写C#方法一样写方法,如图3-2

图3-2

注意:需要加上[Ajax.AjaxMethod]标识,这样才能够被客户端访问

2.4、添加前台代码

在前台添加JS脚本,调用服务器端方法,如图4-1所示(Try.AjaxTest.Add(num),Try为页面类,即AjaxTest类所在的命名空间,这里是Try;而AjaxTest即为类名,Add为方法名)

图4-1

2.5、运行程序,检验结果

按以上四个步骤,就可以实现预期的效果,如图5-1所示。

AjaxPro.dll资源下载地址:http://xiazai.jb51.net/202007/yuanma/AjaxPro_jb51.rar

到此这篇关于浅谈AjaxPro.dll,asp.net 前台js调用后台方法的文章就介绍到这了,更多相关AjaxPro.dll,asp.net 前台js调用后台内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Jquery+asp.net后台数据传到前台js进行解析的方法

    所以在解析后台数据的时候,我们需要根据后台的数据情况,特殊处理和对待. 我这里后台用的是asp.net提供的wcf服务,也有ashx一般处理程序.大致原理差不多. C#中我们经常用的对象,有实体对象比如:User:有List集合,一般为返回列表. 复杂点的还有对象嵌套对象或者list集合的.不过没什么差别,只要看你的数据多少来决定是由js处理数据, 还是后台处理了直接返回最终结果. 1.实体对象:返回是对象的话,在js中,直接就是和你后台代码类中的对象数据是一样的. 比如下面代码,就是获取到一个

  • ASP.NET 前台javascript与后台代码调用

    ASP.NET中前台javascript与后台代码调用 1如何在JavaScript访问C#函数? 2.如何在JavaScript访问C#变量? 3.如何在C#中访问JavaScript的已有变量? 4.如何在C#中访问JavaScript函数? 问题1答案如下: javaScript函数中执行C#代码中的函数: 方法一:1.首先建立一个按钮,在后台将调用或处理的内容写入button_click中; 2.在前台写一个js函数,内容为document.getElementById("btn1&qu

  • asp.net表单提交时防重复提交并执行前台的JS验证

    在项目开发中,遇到这样的一个情况,就是用户重复提交.当然这个不能怪用户,只能怪.NET或者服务器反应迟钝......我是这样理解的. 在网上搜了一下,解决方案是不少,比如: http://bbs.csdn.net/topics/340048988 (这个大家提了不少建议) http://www.cnblogs.com/blsong/archive/2009/12/24/1631144.html (这个基本上总结了网上的方法) 但实际上做互联网web项目中,需要在前台执行JS或者Jquery的验证

  • asp.net后台cs中的JSON格式变量在前台Js中调用方法(前后台示例代码)

    复制代码 代码如下: //后台cs代码: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class Login_jg : System.Web.UI.Page { protected void Page_Load(object sende

  • 浅谈AjaxPro.dll,asp.net 前台js调用后台方法

    1.什么是Ajax Ajax是异步Javascript和XML(Asynchronous JavaScript and XML)的英文缩写."Ajax"这个名词的发明人是Jesse James Garrett,而大力推广并且使Ajax技术炙手可热的是Google.Ajax的核心理念在于使用XMLHttpRequest对象发送异步请求. 2.为什么使用 Ajax减轻服务器的负担.Ajax的原则是"按需取数据",可以最大程序地减少冗余请求,减轻服务器的负担. 无需刷新页

  • 前台js调用后台方法示例

    1.后台方法 复制代码 代码如下: public string AA(string cc) { string dd = "大家好才是真的好"; string message=dd+cc; return message; } 前台JS 复制代码 代码如下: function Init() { var v = "中国"; var s = '<%=AA("' + v + '") %>'; alert(s); } 2.post提交 PVISA

  • 多种方式实现JS调用后台方法进行数据交互

    项目开发过程中很多地方都需要前端和后台的数据交互,几种典型常用的方法如利用控件的AutopostBack属性.Button提交表单等等.但这些都是有条件的,AutoPostBack具有实时性但会刷新页面,Button提交表单不能实现数据交互的实时性.当然说到前台与后台的数据交互更不能漏掉ajax,ajax实现前台与后台数据的异步交互,并且保证实时的.局部刷新.但有些数据不需要异步交互,例如当交互的数据是下一步执行的条件时,就必须要等到数据前台与后台数据交互完成后才能继续执行程序.所以对于掌握js

  • 浅谈键盘上回车按钮的js触发事件

    input 的回车触发事件. 简单,就当做个笔记咯. $("#querySearcher").live("keyup", function (e) { if (e.keyCode == 13) { xxxxxx(); } }); 以上这篇浅谈键盘上回车按钮的js触发事件就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • 浅谈idea live template高级知识_进阶(给方法,类,js方法添加注释)

    为了解决用一个命令(宏)给方法,类,js方法添加注释,经过几天的研究.终于得到结果了. 实现的效果如下: 给Java中的method添加方法: /** * * @Method : addMenu * @Description : * @param menu : * @return : cn.yiyizuche.common.base.ResultMsg * @author : Rush.D.Xzj * @CreateDate : 2017-06-12 星期一 18:17:42 * */publi

  • 浅谈webpack打包生成的bundle.js文件过大的问题

    问题 使用webpack进行打包时,发现bundle.js竟然有2M多. 解决办法 网上有去除插件.提取第三方库.压缩代码等方法. 还有一个比较容易忽略的原因就是开了sourcemap 在生产环境中,应使用devtool: false 关闭sourcemap后bundle.js的大小从2.46M降到302k 以上这篇浅谈webpack打包生成的bundle.js文件过大的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们. 您可能感兴趣的文章: 彻底解决 webpa

  • 前台JS(jquery ajax)调用后台方法实现无刷新级联菜单示例

    前台用AJAX直接调用后台方法,老有人发帖提问,没事做个示例 CasMenu.aspx页面: 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CasMenu.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr

  • 浅谈html转义及防止javascript注入攻击的方法

    有的时候页面中会有一个输入框,用户输入内容后会显示在页面中,类似于网页聊天应用.如果用户输入了一段js脚本,比例:<script>alert('test');</script>,页面会弹出一个对话框,或者输入的脚本中有改变页面js变量的代码则会时程序异常或者达到跳过某种验证的目的.那如何防止这种恶意的js脚本攻击呢?通过html转义能解决这个问题. 一:什么是html转义? html转义是将特殊字符或html标签转换为与之对应的字符.如:< 会转义为 <> 或转义

  • 浅谈Django中view对数据库的调用方法

    question: Django中对数据库的调用非常的隐蔽,在各种复杂的模块互相拼接继承中很难发现获取数据库内容的部分 来,开始试图理解一下下 首先,数据库中的表对应的是model中的每一个类,类中的变量对应表的属性,通常属性名就是变量名.有一个比较特殊的东西就是ForeignKey,它代表了与其他表的关联约束键,即SQL中的约束键,通常和其他表中的主键primary key相关联. 理解了model是我们定义的数据表,接下来的事情就会越发的简单,我们都知道网页中的data信息是通过Django

  • 浅谈jquery fullpage 插件增加头部和版权的方法

    前言 一个页面,我们通过 jquery-fullpage 插件来制作,整个是全屏滚动的.但是,我们希望在最后一页增加一个版权,大概只有 100px 高,而不需要一个全屏来放版权.怎么做呢?搜索了一下,说了各种方法.什么修改源码啦之类的,或者自己写代码判断啦.晕死.其实,官方给出了解决方案. 下面,我们简单的说下是怎么实现的 实现其实只需要 html 部分 <div class="fullpage"> <div class="section fp-auto-h

随机推荐