转】[ASP.NET]使用jQuery的Ajax存取資料(ashx,aspx,asmx)
来源:互联网 发布:谁有x1360的备用域名 编辑:程序博客网 时间:2024/04/29 02:35
前言
之前沒太多xmlHttpRequest與撰寫CallBack javascript的經驗,
一開始寫程式,就被AJAX.NET的UpdatePanel養壞了。
慢慢瞭解到UpdatePanel只是個偽裝的ajax,背後付出的effort仍然相當龐大後,
才慢慢的想去瞭解ajax該如何撰寫。
想要擺脫AutoPostBack付出的龐大成本,javascript與ajax的能力就一定要能養成。
這邊搭配jQuery的ajax功能,來示範一下在ASP.NET上的作法。
Play it
這邊範例的需求是,我們有兩個textbox,一個是ID,一個是Name,
當輸入ID改變時,要帶出Name的資料。(學會之後,就可以擺脫AutoPostBack=true,Text_Changed的方式啦...)
在這裡我把ID帶Name的程式碼,分別寫在三種檔案上來處理。
- .ashx(泛型處理常式)
- .aspx(一般網頁頁面)
- .asmx(Web Service)
為方便各位下載sample code後可以直接跑,
這邊的Name,就是取first name,加上js傳過來的第二個參數MiddleName:『middle』字樣,
last name的部分,則是測試Session值能否被Server端讀取到,所以再補上Session的值『91』來紀念代表從server端回傳的Name。
也就是ajax return回來的值是:畫面上輸入的first name+『middle』+ Session[“LastName”]
接著,讓我們繼續看下去。
- .ashx
- 先新增一個泛型處理常式檔案,記得引用System.Web.SessionState與實作IReadOnlySessionState,我們才能在程式碼裡面讀到Session。
- 接參數的部分,使用context.Request.Form["參數名稱]
- 最後return的值,則是使用context.Response.Write(回傳值)
- .aspx
- 先新增一個.aspx,接著只保留第一行<%@ Page %>那行
- 在Page_Load的事件撰寫要處理的程式碼
- 接參數的部分,使用的是Request.Form["參數名稱]
- 最後return的值,則是直接Response.Write(回傳值)
- .asmx
- 先新增一個.asmx,接著把[System.Web.Script.Services.ScriptService]取消註解
- 新增一個public的method,叫做GetFullName,method上頭加上[WebMethod(EnableSession=true)],才能使用Session
- return的資料直接return即可,雖然return的型別是string,但是javascript實際接到的是xml格式的字串
有了這三種處理ID回傳Name的程式後,
來看看我們的頁面要怎麼撰寫。
網頁的部分,用三組來當試驗:
01
<
body
>
02
<
form
id
=
"form1"
runat
=
"server"
>
03
<
div
>
04
.ashx: first name<
asp:TextBox
ID
=
"txtIDbyAshx"
runat
=
"server"
></
asp:TextBox
>
05
full name<
asp:TextBox
ID
=
"txtNamebyAshx"
runat
=
"server"
></
asp:TextBox
><
br
/>
06
07
.aspx: first name<
asp:TextBox
ID
=
"txtIDbyAspx"
runat
=
"server"
></
asp:TextBox
>
08
full name<
asp:TextBox
ID
=
"txtNamebyAspx"
runat
=
"server"
></
asp:TextBox
><
br
/>
09
10
.ashx: first name<
asp:TextBox
ID
=
"txtIDbyAsmx"
runat
=
"server"
></
asp:TextBox
>
11
full name<
asp:TextBox
ID
=
"txtNamebyAsmx"
runat
=
"server"
></
asp:TextBox
><
br
/>
12
</
div
>
13
</
form
>
14
</
body
>
接著使用jQuery的ajax功能,注意的地方:
- 註冊在change事件
- ajax option:
- type:使用post
- url的部分,web service需加上method名稱
- 傳入參數的部分,可用json,或一般字串使用『&』串接,如同一般的post或QueryString
- ajax成功的話,會進入success,失敗會進入error
- 成功回傳的字串,在success的function(回傳值)
- web service回傳為XML格式,需自行parse使用
結論
ajax的能力未來一定得具備,因為不管是一般的html、畫面冗重的Web form、或是ASP.NET MVC,
要等待Post的過程,對User來說都是種折磨。
既然沒有多難,就順手把它學起來吧!
- 转】[ASP.NET]使用jQuery的Ajax存取資料(ashx,aspx,asmx)
- 续 .net3.5 C# Jquery+Ajax+Aspx(ashx/asmx)
- Jquery Ajax 登录,服务端分别为 aspx,ashx,asmx
- JQuery中ajax,get方法在ashx,aspx,asmx中的使用
- JQuery中ajax,get方法在ashx,aspx,asmx中的使用
- asp.net中Jquery ajax和ashx的结合使用
- 使用jQuery AJax 与 asp.net ashx 结合使用
- Asp.net开发中甩掉.ashx .asmx
- ashx+jQuery,一个轻量级的asp.net ajax解决方案
- 【ASP.NET】利用jQuery与.ashx完成简单的Ajax
- .net中Jquery ajax调用aspx和ashx文件
- jQuery.ajax 调用 服务(.aspx,.asmx)
- ajax图片上传(asp.net +jquery+ashx)
- ascx aspx ashx asmx 为后缀的文件的作用
- 【ASP.NET】利用.ashx、Ajax、Session优化Repeater的使用
- aspx与ashx,asmx之间的参数传递与调用
- asp、asp.net、.aspx、.ascx、.ashx的简单说明
- 甩掉 ashx/asmx,使用jQuery.ajaxWebService请求WebMethod,Ajax处理更加简练
- html标签之Object标签详解
- 打印
- Linux下C/C++程序内存布局 各种类型数据存储区域及生长方向
- 建立一个有向图的十字链表
- CStdioFileEx
- 转】[ASP.NET]使用jQuery的Ajax存取資料(ashx,aspx,asmx)
- 报表:每点击一行,加粗
- AS3加载swf与ApplicationDomain
- 在struts中应用多个国际化资源包
- 图的建立(邻接矩阵表示)
- Mindjet MindManager Pro 7使用快捷键
- 树根结点到r所指结点之间的路径
- 《Windows核心编程》---邮槽通信
- 判断二叉树是否相似