ASP.NET AJAX入門系列(3):使用ScriptManagerProxy控件

ASP.NET AJAX入門系列(3):使用ScriptManagerProxy控件

ASP.NET AJAX中,由於一個ASPX頁面上只能有一個ScriptManager控件,所以在有母版頁的情況下,如果需要在Master-PageContent-Page中需要引入不同的腳本時,這就需要在Content-page中使用ScriptManagerProxy,而不是ScriptManagerScriptManager ScriptManagerProxy 是兩個非常相似的控件。

主要內容

1ScriptManagerProxy控件概述

2.簡單示例

 

一.ScriptManagerProxy控件概述

ASP.NET AJAX中,由於一個ASPX頁面上只能有一個ScriptManager控件,所以在有Master-Page的情況下,如果需要在Master-PageContent-Page中需要引入不同的腳本時,就需要在Content-page中使用ScriptManagerProxy,而不是ScriptManagerScriptManagerProxyScriptManager是兩個非常相似的控件。簡單定義形式如下:

 

 

<asp:ScriptManagerProxy id="ScriptManagerProxy1" runat="server">

    
<Services>

                
<asp:ServiceReference Path="CalculWebService.asmx" />

     
</Services>

</asp:ScriptManagerProxy>
在它下面可以添加的子標籤有:ServicesScriptsAuthenticationServiceProfileService

二.簡單示例

下面看一個簡單的使用ScriptManagerProxy的例子。

1.首先我們準備兩個WebService,在Master-Page中我們輸入一個字符串,而在Content-Page中我們求兩個數的和。

SimpleWebService.asmx.添加一個Master-Page,在它上面添加一個ScriptManager控件,並引入WebService SimpleWebService.asmx,並添加相應的HTML元素:.添加一個Content-Page,在它上面添加一個ScriptManagerProxy控件,並引入WebService CalculWebService.asmx,並添加相應的HTML元素:

[ScriptService]

public class SimpleWebService : System.Web.Services.WebService {

    
public SimpleWebService () {

        
//Uncomment the following line if using designed components 

        
//InitializeComponent(); 

    }


    [WebMethod]

    
public string EchoString(String s)

    
{
        
return "Hello " + s;
    }


}

CalculWebService.asmx

[ScriptService]

public class CalculWebService : System.Web.Services.WebService {

    
public CalculWebService () {

        
//Uncomment the following line if using designed components 

        
//InitializeComponent(); 

    }



    [WebMethod]

    
public int Add(int a,int b) {

        
return a + b;
    }

}

2

<div>

    
<asp:ScriptManager ID="ScriptManager1" runat="server" >

        
<Services>

            
<asp:ServiceReference Path="SimpleWebService.asmx" />

        
</Services>

    
</asp:ScriptManager>

    
<asp:contentplaceholder id="ContentPlaceHolder1" runat="server">

    
</asp:contentplaceholder>

    
&nbsp;<h3>請輸入名稱:</h3>

    
<input id="inputName" type="text" />

    
<input id="button" type="button" value="確 定" onclick="return OnbuttonGo_click()" />

</div>

編寫相應的JS代碼:

<script type="text/javascript" language="JavaScript">

    
function OnbuttonGo_click() 

    
{
        requestSimpleService 
= SimpleWebService.EchoString(

            document.getElementById('inputName').value,       
//params

            OnRequestComplete    
//Complete event

            );

        
return false;
    }


    
function OnRequestComplete(result) 

    
{
        alert(result);
    }


</script>

3

<div>

    
<asp:ScriptManagerProxy id="ScriptManagerProxy1" runat="server">

        
<Services>

                    
<asp:ServiceReference Path="CalculWebService.asmx" />

         
</Services>

    
</asp:ScriptManagerProxy>

    
<h3>請輸入兩個數:</h3>&nbsp;<input id="inputA" type="text" style="width: 110px" />&nbsp;+&nbsp;

    
<input id="inputB" style="width: 110px" type="text" />&nbsp;

    
<input id="buttonEqual" type="button" value=" = "  onclick="return OnbuttonEqual_click()"/>

</div>

編寫相應的JS代碼:

 

 

<script type="text/javascript" language="JavaScript">

    
function OnbuttonEqual_click() 
    
{
        requestSimpleService 
= CalculWebService.Add(

            document.getElementById('inputA').value,       
//params

            document.getElementById('inputB').value,       
//params

            OnRequestComplete    
//Complete event

            );

        
return false;
    }


    
function OnRequestComplete(result) 

    
{
        alert(result);
    }


</script>
4.運行後界面如下:

測試Master-Page中的Web Service

測試Content-Page中的Web Service

關於ScriptManagerProxy就介紹到這兒,有個問題就是在我的IDE中爲什麼ScriptManagerProxy總是提示爲未知元素,但運行起來並不抱錯,結果也可以出來?
示例代碼下載:/Files/Terrylee/ASPNETAJAXScriptManagerProxyDemo.rar

作者:TerryLee
出處:http://terrylee.cnblogs.com
本文版權歸作者和博客園共有,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文連接,否則保留追究法律責任的權利。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章