asp.net非同步觸發用法(AJAX)

來源:互聯網
上載者:User

今天做項目中,由於要非同步觸發,就是當文字框失去焦點時到資料庫去檢查一次,然後就想起了三種方式。

簡單介紹下它的用法:

一.AjaxPro的使用

1.在項目中添加http://www.php.cn/wiki/231.html" target="_blank">引用,瀏覽找到AjaxPro.2.dll檔案

2.在Web.config中的system.web裡面寫入以下代碼
</configuration>
<system.web>
<httpHandlers>
<add verb="*" path="*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/>
</httpHandlers>
</system.web>
<//configuration>

3.在載入事件中,加入
AjaxPro.Utility.RegisterTypeForAjax(typeof(類名));

4.寫的方法都要用
[AjaxPro.AjaxMethod]開頭,然後在寫方法

5.調用時必須寫清楚
命名空間名.類名.方法,例:WebUI._Default.getData();

6.調用可分兩中方法(同步調用,非同步呼叫)

//在後台寫的無參方法
[AjaxPro.AjaxMethod]
public string getStr()
{
return "hello my friends";
}
//在後台寫的有參方法
[AjaxPro.AjaxMethod]
public string getString(string str)
{
return str + "Say: hello my friends";
}

a.同步調用
(1).拖入html控制項button
(2).雙擊,自動顯示在.aspx的指令碼中
(3).在裡面寫入你要輸入的內容
例:
//------------------同步調用無參-----------
function Button1_onclick()
{
var res=WebUI._Default.getStr();
alert(res.value);
}

//------------------同步調用有參------------
function Button2_onclick() //TextBox1為伺服器控制項
{
var str=document.getElementById("<%=TextBox1.ClientID%>").value;
var res=WebUI._Default.getStr(str);
alert(res.value);
}

b.非同步呼叫
(1).拖入html控制項button
(2).雙擊,自動顯示在.aspx的指令碼中
(3).在裡面寫入你要輸入的內容
例:
//-----------------非同步呼叫無參-----------------
function Button3_onclick() {
WebUI._Default.getStr(getStrCallBack);
}
function getStrCallBack(res)
{
alert(res.value);
}
//-----------------非同步呼叫有參-----------------
function Button4_onclick() {
var str=document.getElementById("<%=TextBox1.ClientID %>").value;
WebUI._Default.getString(str,getStringCallBack);
}
function getStringCallBack(res)
{
alert(res.value);
}

7.調用對象

//對象
[AjaxPro.AjaxMethod]
public Class getClass()
{
Class cla = new Class();
cla.C_Id = 100;
cla.C_Name = "34班";
cla.Count = 20;
return cla;
}
//------------------同步調用對象-----------
function Button5_onclick() {
var res=WebUI._Default.getClass().value;
alert("班級編號:"+res.C_Id+"名稱:"+res.C_Name+"人數:"+res.Count);
}
//------------------非同步呼叫對象-----------
function Button6_onclick() {
WebUI._Default.getClass(getClassCallBack);
}
function getClassCallBack(clas)
{
var res=clas.value;
alert("班級編號:"+res.C_Id+"名稱:"+res.C_Name+"人數:"+res.Count);
}

8.資料集的使用
//方法
[AjaxPro.AjaxMethod]
public DataSet getInfo()
{
return WebUI.GetDataSet.getList();
}

//--------------------非同步呼叫資料集--------------
function Button8_onclick() {
WebUI._Default.getInfo(getDataSetCallBack);
}
function getDataSetCallBack(res)
{
var dataset=res.value;
var strHtml="";
strHtml +='<table style ="border-collapse:collapse ; border-color:Gray ;" border="1px">';
strHtml +=' <tr>';
strHtml +=' <td>學生編號</td>';
strHtml +=' <td>名稱</td>';
strHtml +=' <td>年齡</td>';
strHtml +=' </tr>';

for(var i=0;i<dataset.Tables[0].Rows.length;i++)
{
strHtml +=' <tr>';
strHtml +=' <td>'+ dataset.Tables[0].Rows[i].stu_id +'</td>';
strHtml +=' <td>'+ dataset.Tables[0].Rows[i].stu_name +'</td>';
strHtml +=' <td>'+ dataset.Tables[0].Rows[i].stu_age +'</td>';
strHtml +=' </tr>';
}
strHtml +=' </table>';
thedata.innerHTML=strHtml;//thedata是一個<p id="thedata"></p>中的thedata
}



9.驗證碼的使用

//----------------------驗證碼的使用(必須採用同步調用)----------------------

//驗證碼的使用
[AjaxPro.AjaxMethod]
public bool ValidCodeData(string code)
{
return (HttpContext.Current.Session["CheckCode"].ToString()==code);
}

function Button9_onclick() {
var code=document.getElementById("<%=TextBox2.ClientID %>").value;
var bool=WebUI._Default.ValidCodeData(code).value;
if(bool==true)
{
alert("ok");
}else
{
alert("no");
}
}
AjaxPro.dll檔案網上很多的,自己下,如果找不到呢,給我發個留言,我發你郵箱



二,直接調用:
javascript中:<%=後台方法%>
function says()
{
alert("<%=Say()%>");
}
function del()
{
alert("<%=DeleteByID(8)%>");//DeleteByID(8)後台方法名
}

三,採用ICallbackEventHandler回調

/**//*
* 對ICallbackEventHandler介面進行聲明,要在用戶端調用服務端代碼而不回傳,必須聲明該介面並且實現它的兩個方法:
* RaiseCallbackEvent()、GetCallbackResult()
* RaiseCallbackEvent()的參數是從前台傳過來的,根據傳來的參數執行不同的代碼並將結果用GetCallbackResult()返回前台
*/

//必須聲明System.Web.UI.ICallbackEventHandler介面
public partial class _Default : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler
{
//定義一個回調的傳回值
private string Result;
//定義兩個變數,用來接收頁面傳過來到運算元
private string Num1;
private string Num2;
protected void Page_Load(object sender, EventArgs e)
{

}

/**//// <summary>
/// 該方法是回調執行的方法,根據參數在這個方法中處理回調的內容,該方法沒有傳回值
/// </summary>
/// <param name="eventArgument">此參數是從用戶端傳過來的</param>
public void RaiseCallbackEvent(string eventArgument)
{
//eventArgumeng 為javascript從用戶端傳遞的參數,本例傳過來三個參數用“/”分割將每個參數取出存入數組
string[] PagParams = eventArgument.Split('/');
Num1 = PagParams[1];
Num2 = PagParams[2];
//根據第一個參數(所選的操作符),調用不同的執行函數
switch (PagParams[0])
{
case "0":
Result = add(); break;
case "1":
Result = sub(); break;
case "2":
Result = multi(); break;
case "3":
Result = pision(); break;
}
}

/**//// <summary>
/// 該方法是返回回調的結果給用戶端
/// </summary>
/// <returns></returns>
public string GetCallbackResult()
{
return Result;
}

//一下四個函數是通過RaiseCallbackEvent方法,調用的回調要執行操作的函數
private string add()
{
double addResult = double.Parse(Num1) + double.Parse(Num2);
return addResult.ToString();
}

private string sub()
{
double addResult = double.Parse(Num1) - double.Parse(Num2);
return addResult.ToString();
}

private string multi()
{
double addResult = double.Parse(Num1) * double.Parse(Num2);
return addResult.ToString();
}

private string pision()
{
double addresult = double.Parse(Num1) / double.Parse(Num2);
return addresult.ToString();
}
}

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.