Ajax调用webservice实现RadiobuttonList 和DorpDownList联动

1、首先定义简单的实体类：

View Code

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace GenerateBaseDataWeb
{
public class ClsServiceDrp
{
private string id;

public string Id
{
get { return id; }
set { id = value; }
}
private string name;

public string Name
{
get { return name; }
set { name = value; }
}
}
}

2、WebService代码：

View Code

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;

using System.Web.Script.Services;
using System.Web.UI.WebControls;
using System.Data;
using AjaxControlToolkit;

namespace GenerateBaseDataWeb
{
/// <summary>
/// AjaxService 的摘要说明
/// </summary>
[WebService(Namespace = " http://tempuri.org/ " )]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem( false )]
// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
public class AjaxService : System.Web.Services.WebService
{

[WebMethod]
public List < ClsServiceDrp > GetDropDownListDate( string fileName)
{
List < ClsServiceDrp > list = new List < ClsServiceDrp > ();
ClsServiceDrp cls;
if (fileName.StartsWith( " Is " ))
{
cls = new ClsServiceDrp();
cls.Id = " True " ;
cls.Name = " True " ;
list.Add(cls);
cls = new ClsServiceDrp();
cls.Id = " False " ;
cls.Name = " False " ;
list.Add(cls);
}
else
{
DataSet ds = BaseMethod.GetControlDataSet(fileName, fileName);
if (ds != null && ds.Tables[ 0 ].Rows.Count > 0 )
{
for ( int i = 0 ; i < ds.Tables[ 0 ].Rows.Count;i ++ )
{
cls = new ClsServiceDrp();
cls.Id = ds.Tables[ 0 ].Rows[i][ " id " ].ToString();
cls.Name = ds.Tables[ 0 ].Rows[i][ " name " ].ToString();
list.Add(cls);
}
}
}
return list;
}
}
}

注意：要在类前加[System.Web.Script.Services.ScriptService]的属性。

3、页面代码：

View Code

<% @ Page Language = " C# " AutoEventWireup = " true " CodeBehind = " WebForm1.aspx.cs " Inherits = " GenerateBaseDataWeb.WebForm1 " %>

<% @ Register Assembly = " AjaxControlToolkit " Namespace = " AjaxControlToolkit " TagPrefix = " asp " %>
<! DOCTYPE html PUBLIC " -//W3C//DTD XHTML 1.0 Transitional//EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
< html xmlns = " http://www.w3.org/1999/xhtml " >
< head runat = " server " >
< title ></ title >

< script type = " text/javascript " >

function showdiv() {

var filename = " IsActive " ;
var ctrl = document.getElementById( " <%=radioDropdownCategory.ClientID %> " );
var col = ctrl.all;
for (i = 0 ; i < col.length; i ++ ) {
if (col[i].tagName.toUpperCase() == ' INPUT ' ) {
if (col[i]. checked ) {
filename = col[i].value;
}
}
}
BindDropDownList(filename);
}

function BindDropDownList(filename) {
/// 调用webservice方法时，必须将命名空间也加上，如这种格式：[namespace].[class].[method],否则会报service未定义的错误
/// FillEmployeeList就是返回的结果，如果方法有参数，写在返回结果也就是FillEmployeeList的前面。
GenerateBaseDataWeb.AjaxService.GetDropDownListDate(filename, FillEmployeeList, ErrorHandler, TimeOutHandler);

}
function FillEmployeeList(result) {
var oldDrp = document.getElementById( " <%=drpOld.ClientID %> " );
var newDrp = document.getElementById( " <%=drpNew.ClientID %> " );
clearSelect(oldDrp);
clearSelect(newDrp);

for (var i = 0 ; i < result.length; i ++ ) {
// 每个dropdwonlist都需要定义一个变量，若只定义一个变量，则只有最后的dropdownlist的项才会增加
var option = new Option(result[i].Id, result[i].Name);

var option1 = new Option(result[i].Id, result[i].Name);
oldDrp.options.add(option);
newDrp.options.add(option1);
}
}

function TimeOutHandler(result) {
alert( " Timeout : " + result);
}

function ErrorHandler(result) {
var msg = result.get_exceptionType() + " \r\n " ;
msg += result.get_message() + " \r\n " ;
msg += result.get_stackTrace();
alert(msg);
}

function clearSelect(select) {
for (var i = select.options.length; i >= 0 ; i -- ) {
select.options[i] = null ;
}

}
</ script >

</ head >
< body >
< div >
< form id = " formId " runat = " server " >
< asp:ToolkitScriptManager ID = " ToolkitScriptManager1 " runat = " server " >
< Services >
< asp:ServiceReference Path = " ~/AjaxService.asmx " />
</ Services >
</ asp:ToolkitScriptManager >
< table >
< tr >
< td height = " 35 " align = " left " class = " style3 " colspan = " 2 " >
< asp:RadioButtonList ID = " radioDropdownCategory " runat = " server " RepeatColumns = " 5 "
onclick = " showdiv() " >
< asp:ListItem > IsActive </ asp:ListItem >
< asp:ListItem > ItemTypeID </ asp:ListItem >
< asp:ListItem > Option_C </ asp:ListItem >
< asp:ListItem > Isnew </ asp:ListItem >
< asp:ListItem > ItemFamilyID </ asp:ListItem >
< asp:ListItem > Option_D </ asp:ListItem >
< asp:ListItem > Ispreorder </ asp:ListItem >
< asp:ListItem > ItemCategoryID </ asp:ListItem >
< asp:ListItem > ItemStatus </ asp:ListItem >
< asp:ListItem > IsWholeSales </ asp:ListItem >
< asp:ListItem > ItemColor </ asp:ListItem >
< asp:ListItem > VendorID </ asp:ListItem >
< asp:ListItem > ISSingle </ asp:ListItem >
< asp:ListItem > ItemSize </ asp:ListItem >
< asp:ListItem > Brand </ asp:ListItem >
</ asp:RadioButtonList >
</ td >
</ tr >
< tr >
< td height = " 35 " align = " left " class = " style3 " >
< span class = " title " > Old </ span >
< asp:DropDownList ID = " drpOld " runat = " server " CssClass = " DDl_SIZE " Width = " 120px " >
</ asp:DropDownList >
</ td >
< td height = " 35 " align = " left " class = " style3 " >
< span class = " title " > New </ span >
< asp:DropDownList ID = " drpNew " runat = " server " CssClass = " DDl_SIZE " Width = " 120px " >
</ asp:DropDownList >
</ td >
</ tr >
</ table >
</ form >
</ div >
</ body >
</ html >

注意：要在ScriptManager中添加webservice的地址：

　　<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
            <Services>
                <asp:ServiceReference Path="~/AjaxService.asmx" />
            </Services>
        </asp:ToolkitScriptManager>

此时可实现无刷新的联动效果。

可参考此篇博文： http://www.cnblogs.com/webabcd/archive/2007/02/12/648087.html

转载于:https://www.cnblogs.com/madachi/archive/2011/03/09/1977819.html