功能:在textbox中输入内容,动态从数据库模糊查询显示到下拉框中,以供选择
1.建立一aspx页面,html代码
<HTML>
<HEAD>
<title>WebForm1</title>
<SCRIPTlanguage="javascript">
//城市------------------------------
functioncityResult()
{
varcity=document.getElementById("TextBox1");
WebForm1.GetCityList(city.value,get_city_Result_CallBack);
}
functionget_city_Result_CallBack(response)
{
if(response.value!=null)
{
//debugger;
document.getElementById("DropDownList1").style.display="block";
document.getElementById("DropDownList1").length=0;
vards=response.value;
if(ds!=null&&typeof(ds)=="object"&&ds.Tables!=null)
{
for(vari=0;i<ds.Tables[0].Rows.length;i++)
{
varname=ds.Tables[0].Rows[i].city;
varid=ds.Tables[0].Rows[i].cityID;
document.getElementById("DropDownList1").options.add(newOption(name,id));
}
}
}
else
{
document.getElementById("DropDownList1").style.display="none";
}
return
}
functiongetData()
{
varprovince=document.getElementById("DropDownList1");
varpindex=province.selectedIndex;
varpValue=province.options[pindex].value;
varpText=province.options[pindex].text;
document.getElementById("<%=TextBox1.ClientID%>").innerText=pText;
}
</SCRIPT>
</HEAD>
<body>
<formid="Form1"method="post"runat="server">
<asp:TextBoxID="TextBox1"runat="server"></asp:TextBox>
<br>
<asp:DropDownListID="DropDownList1"runat="server"Width="192px"style="display:none"></asp:DropDownList>
</form>
</body>
</HTML> 2.cs代码
usingSystem;
usingSystem.Collections;
ponentModel;
usingSystem.Data;
usingSystem.Drawing;
usingSystem.Web;
usingSystem.Web.SessionState;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.HtmlControls;
usingSystem.Data.SqlClient;
namespaceajaxselect
{
/**////<summary>
///SummarydescriptionforWebForm1.
///</summary>
publicclassWebForm1:System.Web.UI.Page
{
protectedSystem.Web.UI.WebControls.TextBoxTextBox1;
protectedSystem.Web.UI.WebControls.DropDownListDropDownList1;
privatevoidPage_Load(objectsender,System.EventArgse)
{
Ajax.Utility.RegisterTypeForAjax(typeof(WebForm1));
if(!Page.IsPostBack)
{
this.TextBox1.Attributes.Add("onchange","cityResult();");
this.DropDownList1.Attributes.Add("onclick","getData();");
}
}
WebFormDesignergeneratedcode#regionWebFormDesignergeneratedcode
overrideprotectedvoidOnInit(EventArgse)
{
//
//CODEGEN:WebFormDesigner.
//
InitializeComponent();
base.OnInit(e);
}
/**////<summary>
///RequiredmethodforDesignersupport-donotmodify
///thecontentsofthismethodwiththecodeeditor.
///</summary>
privatevoidInitializeComponent()
{
this.Load+=newSystem.EventHandler(this.Page_Load);
}
#endregion
GetCityList#regionGetCityList
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
publicDataSetGetCityList(intprovinceid)
{
stringsql="select*fromcitywherefatherlike'%"+provinceid+"%'";
returnGetDataSet(sql);
}
#endregion
GetDataSet#regionGetDataSet
publicstaticDataSetGetDataSet(stringsql)
{
stringConnectionString=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
SqlDataAdaptersda=newSqlDataAdapter(sql,ConnectionString);
DataSetds=newDataSet();
sda.Fill(ds);
returnds;
}
#endregion
}
} 3.源代码下载
4.数据库脚本
CREATETABLE[dbo].[city](
[id][int]NOTNULL,
[cityID][nvarchar](6)COLLATEChinese_PRC_CI_ASNULL,
[city][nvarchar](50)COLLATEChinese_PRC_CI_ASNULL,
[father][nvarchar](6)COLLATEChinese_PRC_CI_ASNULL,
CONSTRAINT[PK_city]PRIMARYKEYCLUSTERED
(
[id]ASC
)WITH(IGNORE_DUP_KEY=OFF)ON[PRIMARY]
)ON[PRIMARY]