Ich habe in letzter Zeit einige Website-Programme ausgeführt und verwende häufig mehrere Dropdown-Menüoptionen. Nachdem ich die Einführung gelesen hatte, begann ich, das AjaxPro-Steuerelement zu verwenden, und ich habe das Gefühl, dass der Effekt gut ist. Ich habe MagicAjax schon einmal verwendet, aber ich habe es vergessen, nachdem ich es längere Zeit nicht verwendet habe. Das Schlimmste ist, dass es bei der Arbeit mit virtuellen Verzeichnissen problematischer ist. Haha, es gibt viele davon im Internet, Anfänger jedoch oft nicht Ich habe mich auch an wichtige Punkte erinnert, also ignorieren Sie es bitte. Ich habe gesehen, dass AjaxPro relativ einfach zu verwenden ist. Diesmal habe ich 6.x verwendet, und die neueste Version ist 7.x. Ich dachte, die 6.0-Serie sei praktischer, also habe ich mich dafür entschieden.
An wichtigen Stellen gibt es Hinweise, ich glaube, es ist leicht zu verstehen.
Fügen Sie zunächst diesen Kontaktpunkt zwischen <system.web> und </system.web> in web.config wie folgt hinzu:
<system.web>
<!--für Ajaxnet-->
<httpHandlers>
<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro.2"/>
</httpHandlers>
<!--Andere Einstellungen-->
</system.web>
Legen Sie dann AjaxPro.2.dll in den Ordner „bin“ und verweisen Sie darauf.
Es ist besser, den Code zu senden, das ist zu mühsam. Der folgende Code stammt aus Default.aspx.cs.
Verwenden des Systems;
Verwenden von System.Data;
Verwenden von System.Configuration;
mit System.Data.OleDb;
mit System.Web;
mit System.Web.UI;
mit System.Web.UI.WebControls;
mit System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
öffentliche Teilklasse _Default: System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
AjaxPro.Utility.RegisterTypeForAjax(typeof(_Default)); //Notwendig
if(!IsPostBack)BindDc();
}
/**//// <Zusammenfassung>
/// Datenbankverbindung http://www.downcodes.com
/// </summary>
/// <returns></returns>
öffentliche OleDbConnection myConn()
{
string ConnStr = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + System.Web.HttpContext.Current.Server.MapPath(ConfigurationManager.AppSettings["dbpath"]);
OleDbConnection conn = new OleDbConnection(ConnStr);
versuchen
{
conn.Open();
Rücklaufverbindung;
}
fangen
{
werfen;
}
}
/**//// <Zusammenfassung>
/// Untergeordnete Kategorien abrufen
/// </summary>
[AjaxPro.AjaxMethod]
öffentliches DataSet getNextClass(string cid)
{
//Da wir nicht möchten, dass die Seite den Feldnamen kennt, also als txt, id als vol. Wenn es sich um SQL Ser handelt, können Sie = verwenden
//Der von der Seite erhaltene Spaltenname muss mit diesem identisch sein und unterscheidet zwischen Groß- und Kleinschreibung. Dies ist normalerweise eine leicht zu übersehende Stelle.
//Die sekundäre Klassifizierung hat sich also nicht geändert
string sql = @"select cname as txt,id as vol from webclass where parentid=" + cid;
versuchen
{
return getDs(sql);
}
fangen
{
//werfen;
null zurückgeben;
}
}
/**//// <Zusammenfassung>
/// Ein DataSet zurückgeben
/// </summary>
/// <param name="SQL"></param>
/// <returns></returns>
öffentliches DataSet getDs(string SQL)
{
OleDbConnection conn = myConn();
DataSet Ds = new DataSet();
OleDbDataAdapter Da = new OleDbDataAdapter(SQL, conn);
versuchen
{
Da.Fill(Ds);
Rückkehr Ds;
}
fangen
{
null zurückgeben;
//werfen;
}
}
/**//// <Zusammenfassung>
/// //Datenbindung
/// </summary>
private void BindDc()
{
//erster
string sql = @"select * from webclass where Parentid=0";
ddl1.DataSource = getDs(sql);
ddl1.DataTextField = "cname";
ddl1.DataValueField = "id";
ddl1.DataBind();
if (ddl1.DataSource != null) ddl1.Attributes.Add("onchange", "showNext(this.options[selectedIndex].value,'ddl2');");
//Sie können zunächst DropDownList.SelectedItem.Value ermitteln
//Zweiter
sql = @"select * from webclass where parentid=" + ddl1.SelectedItem.Value;
ddl2.DataSource = getDs(sql);
ddl2.DataTextField = "cname";
ddl2.DataValueField = "id";
ddl2.DataBind();
//Der Dritte
if (ddl2.DataSource != null) ddl2.Attributes.Add("onchange", "showNext(this.options[selectedIndex].value,'ddl3');");
sql = @"select * from webclass where parentid=" + ddl2.SelectedItem.Value;
ddl3.DataSource = getDs(sql);
ddl3.DataTextField = "cname";
ddl3.DataValueField = "id";
ddl3.DataBind();
}
}
default.aspx-Inhalt:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>AjaxPro realisiert eine dreistufige Verknüpfung ohne Aktualisierung</title>
</head>
<script language="javascript" type="text/javascript">
<!--
//ACLOUD allgemeine JS-Funktionen
Funktion getBid(s){
return document.getElementById(s);
}
Funktion getBmc(s){
return document.getElementByName(s);
}
//Kategorieliste anzeigen
Funktion showNext(sid,obj)
{
if(sid==null || sid=="" || sid.length<1)return;
var slt =getBid(obj);
var v = _Default.getNextClass(sid).value; // Der Name der Klasse
//alert(v);
//zurückkehren;
if (v != null){
if(v != null && typeof(v) == "object" && v.Tables != null)
{
slt.length = 0;
slt.options.add(new Option("Bitte auswählen",0));
// „Bitte auswählen“ hinzugefügt, hauptsächlich um das Onchange-Ereignis auszulösen
if(obj=="ddl2"){
getBid("ddl3").options.length=0;
getBid("ddl3").options.add(new Option("Please select",0));
}
for(var i=0; i<v.Tables[0].Rows.length; i++)
{
var txt = v.Tables[0].Rows[i].txt; //An dieser Stelle muss die Groß-/Kleinschreibung beachtet werden. var vol = v.Tables[0].Rows[i].vol; //Folgen Sie den Spalten von die Datensatztabelle Die Namen müssen konsistent sein slt.options.add(new Option(txt,vol));
}
}
}
zurückkehren;
}
->
</script>
<Körper>
<form id="form1" runat="server">
<div>
<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="99"> </td>
<td width="401">
Stadt<asp:DropDownList ID="ddl1" runat="server">
</asp:DropDownList>
Region<asp:DropDownList ID="ddl2" runat="server">
</asp:DropDownList>
Garten<asp:DropDownList ID="ddl3" runat="server">
</asp:DropDownList></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</div>
</form>
</body>
</html>
Verwandte Dokumente