Saya telah melakukan beberapa program situs web baru-baru ini, dan saya sering menggunakan beberapa opsi menu drop-down. Setelah membaca pendahuluan, saya mulai menggunakan kontrol AjaxPro, dan saya merasa efeknya bagus. Saya pernah menggunakan MagicAjax sebelumnya, tapi saya lupa setelah lama tidak menggunakannya. Yang paling merepotkan adalah lebih merepotkan saat bekerja dengan direktori virtual. Haha, banyak di Internet, tapi pemula sering kali tidak teringat poin penting. Saya juga, jadi para ahli tolong abaikan saja. Saya melihat AjaxPro relatif mudah digunakan, kali ini saya menggunakan 6.x, dan yang terbaru adalah 7.x. Saya rasa seri 6.0 lebih nyaman, jadi saya memilihnya.
Ada petunjuk di tempat-tempat penting, saya yakin mudah dimengerti.
Pertama tambahkan titik kontak ini antara <system.web> dan </system.web> di web.config, sebagai berikut:
<sistem.web>
<!--untuk Ajaxnet-->
<httpHandler>
<tambahkan kata kerja="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro.2"/>
</httpHandler>
<!--Pengaturan lainnya-->
</sistem.web>
Kemudian masukkan AjaxPro.2.dll ke dalam folder bin dan referensikan.
Lebih baik kirim kodenya, repot juga. Kode di bawah ini dari Default.aspx.cs.
menggunakan Sistem;
menggunakan Sistem.Data;
menggunakan Sistem.Konfigurasi;
menggunakan Sistem.Data.OleDb;
menggunakan Sistem.Web;
menggunakan Sistem.Web.UI;
menggunakan Sistem.Web.UI.WebControls;
menggunakan System.Web.UI.WebControls.WebParts;
menggunakan System.Web.UI.HtmlControls;
kelas parsial publik _Default : System.Web.UI.Page
{
dilindungi kekosongan Page_Load (pengirim objek, EventArgs e)
{
AjaxPro.Utility.RegisterTypeForAjax(typeof(_Default)); //Diperlukan
if(!IsPostBack)BindDc();
}
/**//// <ringkasan>
/// Koneksi basis data http://www.downcodes.com
/// </ringkasan>
/// <pengembalian></pengembalian>
OleDbConnection publik myConn()
{
string ConnStr = "Penyedia=Microsoft.Jet.OLEDB.4.0;Sumber Data=" + System.Web.HttpContext.Current.Server.MapPath(ConfigurationManager.AppSettings["dbpath"]);
Sambungan OleDbConnection = OleDbConnection baru(ConnStr);
mencoba
{
samb.Buka();
koneksi kembali;
}
menangkap
{
melemparkan;
}
}
/**//// <ringkasan>
/// Dapatkan kategori tingkat yang lebih rendah
/// </ringkasan>
[Metode AjaxPro.Ajax]
Kumpulan Data publik getNextClass(string cid)
{
//Karena kita tidak ingin halaman mengetahui nama field, jadi sebagai txt, id sebagai vol
//Nama kolom yang diperoleh halaman harus sama dengan yang ini dan peka huruf besar-kecil. Ini biasanya mudah untuk diabaikan.
//Jadi klasifikasi sekundernya tidak berubah
string sql = @"pilih cname sebagai txt,id sebagai vol dari kelas web di mana parentid=" + cid;
mencoba
{
kembalikan getDs(sql);
}
menangkap
{
//melemparkan;
kembalikan nol;
}
}
/**//// <ringkasan>
/// Mengembalikan Kumpulan Data
/// </ringkasan>
/// <param nama="SQL"></param>
/// <pengembalian></pengembalian>
GetDs Kumpulan Data publik (string SQL)
{
Koneksi OleDbConnection = myConn();
Kumpulan Data Ds = Kumpulan Data baru();
OleDbDataAdapter Da = new OleDbDataAdapter(SQL, samb);
mencoba
{
Da.Isi(Ds);
kembalikan D;
}
menangkap
{
kembalikan nol;
//melemparkan;
}
}
/**//// <ringkasan>
/// //Pengikatan data
/// </ringkasan>
kekosongan pribadi BindDc()
{
//yang pertama
string sql = @"pilih * dari kelas web di mana 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');");
//Anda dapat menentukan DropDownList.SelectedItem.Value terlebih dahulu
//Yang kedua
sql = @"pilih * dari kelas web di mana parentid=" + ddl1.SelectedItem.Value;
ddl2.DataSource = getDs(sql);
ddl2.DataTextField = "cname";
ddl2.DataValueField = "id";
ddl2.DataBind();
//Yang ketiga
if (ddl2.DataSource != null) ddl2.Attributes.Add("onchange", "showNext(this.options[selectedIndex].value,'ddl3');");
sql = @"pilih * dari kelas web di mana parentid=" + ddl2.SelectedItem.Value;
ddl3.DataSource = getDs(sql);
ddl3.DataTextField = "cname";
ddl3.DataValueField = "id";
ddl3.DataBind();
}
}
konten default.aspx:
<%@ Halaman 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="Jenis Konten" content="teks/html; charset=gb2312" />
<title>AjaxPro mewujudkan hubungan tiga tingkat tanpa penyegaran</title>
</kepala>
<skrip bahasa="javascript" type="teks/javascript">
<!--
//Fungsi JS umum ACLOUD
fungsi getBid(s){
kembalikan dokumen.getElementById(s);
}
fungsi getBmc(s){
kembalikan dokumen.getElementByName(s);
}
//Menampilkan daftar kategori
fungsi tampilkanBerikutnya(sid,obj)
{
if(sid==null || sid=="" || sid.length<1)return;
var slt =getBid(obj);
var v = _Default.getNextClass(sid).value; // Nama kelas
//peringatan(v);
//kembali;
jika (v != nol){
if(v != null && typeof(v) == "objek" && v.Tabel != null)
{
slt.panjang = 0;
slt.options.add(Opsi baru("Silakan pilih",0));
//Menambahkan "Silakan pilih" terutama untuk memicu acara onchange
jika(obj=="ddl2"){
getBid("ddl3").options.length=0;
getBid("ddl3").options.add(Opsi baru("Silakan pilih",0));
}
for(var i=0; i<v.Tabel[0].Baris.panjang; i++)
{
var txt = v.Tables[0].Rows[i].txt; //Tempat ini harus peka huruf besar-kecil var vol = v.Tables[0].Rows[i].vol; tabel kumpulan data Nama harus konsisten slt.options.add(new Option(txt,vol));
}
}
}
kembali;
}
-->
</skrip>
<tubuh>
<form id="form1" runat="server">
<div>
<tabel lebar="500" border="0" align="center" cellpadding="0" Cellspacing="0">
<tr>
<td lebar="99"> </td>
<td lebar="401">
Kota<asp:DropDownList ID="ddl1" runat="server">
</asp:Daftar DropDown>
Wilayah<asp:DropDownList ID="ddl2" runat="server">
</asp:Daftar DropDown>
Taman<asp:DropDownList ID="ddl3" runat="server">
</asp:DropDownList></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</tabel>
</div>
</bentuk>
</tubuh>
</html>
Dokumen terkait