1.建立一个aspx页เลดี้
html 代码
<html xmlns=" http://www.w3.org/1999/xhtml " >
<head id="Head1" runat="เซิร์ฟเวอร์">
<title>มีขนาดเล็กลง</title>
<link type="text/css" href="../../Styles/tree_css/tree.css" rel="stylesheet">
</หัว>
<ร่างกาย>
<form id="Form1" runat="server">
<ความกว้างของตาราง=เซลล์แพดดิ้ง 100%=0 ระยะห่างเซลล์=0 เส้นขอบ=0>
<คอลกรุ๊ป>
<ความกว้างสี=180 />
<สี />
</คอลกรุ๊ป>
<tr>
<td>
<div class="TreeMenu" id="CategoryTree" style="width: 100%; height: 489px">
</div>
</td>
<td>
<iframe id=furl height=20 style="height: 497px; width: 100%;"></iframe>
</td>
</tr>
</ตาราง>
<ภาษาสคริปต์ = "jscript">
ฟังก์ชั่นเอล(id)
-
ส่งคืน document.getElementById(id);
-
ฟังก์ชั่น ExpandSubCategory (iCategoryID)
-
var li_father = el("li_" + iCategoryID);
if (li_father.getElementsByTagName("li").length > 0) //分类已下载
-
สถานะการเปลี่ยนแปลง(iCategoryID);
กลับ;
-
li_father.className = "เปิดแล้ว";
switchNote(iCategoryID, จริง);
AjaxMethod.GetSubCategory (iCategoryID, GetSubCategory_callback);
}
ฟังก์ชัน GetSubCategory_callback (ตอบกลับ)
-
var dt = response.value.Tables[0];
ถ้า (dt.Rows.length > 0)
-
var iCategoryID = dt.Rows[0].FatherID;
-
var li_father = el("li_" + iCategoryID);
var ul = document.createElement("ul");
สำหรับ (var i = 0;i < dt.Rows.length;i++)
-
ถ้า (dt.Rows[i].IsChild == 1) //叶子节点
-
var li = document.createElement("li");
li.className = "เด็ก";
li.id = "li_" + dt.Rows[i].รหัสหมวดหมู่;
var img = document.createElement("img");
img.id = dt.Rows[i].CategoryID;
img.className = "s";
img.src = "../../Styles/tree_css/s.gif";
var a = document.createElement("a");
var id = dt.Rows[i].CategoryID;
a.onmouseover = ฟังก์ชั่น()
-
ดูตัวอย่างรูปภาพ(id);
-
a.href = "javascript:OpenDocument('" + dt.Rows[i].CategoryID + "');";
a.innerHTML = dt.Rows[i].ชื่อหมวดหมู่;
-
อื่น
-
var li = document.createElement("li");
li.className = "ปิด";
li.id = "li_" + dt.Rows[i].รหัสหมวดหมู่;
var img = document.createElement("img");
img.id = dt.Rows[i].CategoryID;
img.className = "s";
img.src = "../../Styles/tree_css/s.gif";
img.onclick = ฟังก์ชั่น () {
ExpandSubCategory(this.id);
-
img.alt = "ขยายเริ่มต้น/折叠";
var a = document.createElement("a");
a.href = "javascript:ExpandSubCategory(" +
dt.Rows[i].CategoryID + ");";
a.innerHTML = dt.Rows[i].ชื่อหมวดหมู่;
-
li.appendChild(img);
li.appendChild(ก);
ul.ผนวกเด็ก(li);
-
li_father.appendChild(ul);
switchNote(iCategoryID, เท็จ);
-
// 叶子节点的单击响应函数
ฟังก์ชั่น OpenDocument (iCategoryID)
-
// 预加载信息
โหลดFormUrlล่วงหน้า(iCategoryID);
-
ฟังก์ชั่น PreviewImage (iCategoryID)
-
}
ฟังก์ชัน ChangeStatus(iCategoryID)
-
var li_father = el("li_" + iCategoryID);
ถ้า (li_father.className == "ปิด")
-
li_father.className = "เปิดแล้ว";
-
อื่น
-
li_father.className = "ปิดแล้ว";
-
}
ฟังก์ชั่น switchNote(iCategoryID, แสดง)
-
var li_father = el("li_" + iCategoryID);
ถ้า (แสดง)
-
var ul = document.createElement("ul");
ul.id = "ul_note_" + iCategoryID;
var note = document.createElement("li");
note.className = "เด็ก";
var img = document.createElement("img");
img.className = "s";
img.src = "../../Styles/tree_css/s.gif";
var a = document.createElement("a");
a.href = "javascript:void(0);";
a.innerHTML = "请稍候";
note.appendChild (img);
note.appendChild(ก);
ul.appendChild(หมายเหตุ);
li_father.appendChild(ul);
-
อื่น
-
var ul = el("ul_note_" + iCategoryID);
ถ้า (ul)
-
li_father.removeChild(ul);
-
-
}
// 加载根节点
var tree = el("หมวดหมู่ต้นไม้");
var root = document.createElement("li");
root.id = "li_0";
tree.appendChild (ราก);
// 加载页的时显示第一级分类
ขยายหมวดหมู่ย่อย(0);
ฟังก์ชั่น PreloadFormUrl (iCategoryID)
-
// 采用同步调用的方式获取ภาพ的信息
var ds = AjaxMethod.GetFormsList(iCategoryID).value;
// 如果返回了结果
ถ้า (ds)
-
// 判断数据表是否不为空
ถ้า (ds.Tables[0].Rows.length > 0)
-
// 返回的信息数据表
dt = ds.ตาราง[0];
el("furl").src = dt.Rows[0].FormUrl;
-
อย่างอื่น // 分类下没有
-
-
-
-
</สคริปต์>
</แบบฟอร์ม>
</ร่างกาย>
</html>2.cs 代码
ใช้ระบบ;
ใช้ System.Data;
โดยใช้ระบบการกำหนดค่า;
ใช้ System.Collections;
ใช้ System.Web;
โดยใช้ System.Web.Security;
โดยใช้ System.Web.UI;
ใช้ System.Web.UI.WebControls;
ใช้ System.Web.UI.WebControls.WebParts;
ใช้ System.Web.UI.HtmlControls;
ใช้ AjaxPro;
คลาสสาธารณะบางส่วน Pages_Home_HomePage : System.Web.UI.Page
-
โมฆะที่ได้รับการป้องกัน Page_Load (ผู้ส่งวัตถุ EventArgs e)
-
Utility.RegisterTypeForAjax (ประเภทของ (AjaxMethod));
-
}3.tree.css ของ CSS
ก
-
การตกแต่งข้อความ: ไม่มี;
-
ก: เยี่ยมชมแล้ว
-
สี:#000;
พื้นหลัง:สืบทอด;
-
ร่างกาย
-
ระยะขอบ:0;
ช่องว่างภายใน:20px;
ตัวอักษร: 12px tahoma, 宋体, sans-serif;
-
dt
-
ขนาดตัวอักษร:22px;
แบบอักษรน้ำหนัก: ตัวหนา;
ระยะขอบ:0 0 0 15px;
-
วว
-
ระยะขอบ:0 0 0 15px;
-
h4
-
ระยะขอบ:0;
ช่องว่างภายใน:0;
ขนาดตัวอักษร:18px;
การจัดตำแหน่งข้อความ: กึ่งกลาง;
-
พี
-
ระยะขอบ:0;
การขยาย:0 0 0 18px;
-
ป๊ะป๊า:มาแล้ว
-
สี:#00f;
พื้นหลัง:สืบทอด;
}
.TreeMenu img.s
-
เคอร์เซอร์:มือ;
แนวตั้งจัด: กลาง;
-
.TreeMenu อ
-
ช่องว่างภายใน:0;
-
.TreeMenu ลี่
-
รายการสไตล์: ไม่มี;
ช่องว่างภายใน:0;
-
.ปิด UL
-
จอแสดงผล:ไม่มี;
-
.ภาพเด็ก.s
-
พื้นหลัง:ไม่มี;
เคอร์เซอร์: ค่าเริ่มต้น;
}
#CategoryTree ul
-
ระยะขอบ:0 0 0 17px;
-
#CategoryTree img.s
-
ความกว้าง:34px;
ความสูง:18px;
-
#CategoryTree .เปิด img.s
-
พื้นหลัง: url (skin3/opened.gif) ไม่ซ้ำ 0 1px;
-
#CategoryTree .ปิด img.s
-
พื้นหลัง: url (skin3/closed.gif) ไม่ซ้ำ 0 1px;
-
#CategoryTree .ภาพเด็ก img.s
-
พื้นหลัง: url (skin3/child.gif) ไม่ซ้ำ 13px 2px;
}
#หมวดหมู่ต้นไม้
-
ลอย:ซ้าย;
ความกว้าง:249px;
เส้นขอบ:1px ทึบ #99BEEF;
พื้นหลัง:#D2E4FC;
สี:สืบทอด;
ระยะขอบ:3px;
ช่องว่างภายใน:3px;
ความสูง:600px;
-
4.建立一个类AjaxMethod
ใช้ระบบ;
ใช้ System.Data;
โดยใช้ System.Data.SqlClient;
โดยใช้ระบบการกำหนดค่า;
ใช้ System.Web;
โดยใช้ System.Web.Security;
โดยใช้ System.Web.UI;
ใช้ System.Web.UI.WebControls;
ใช้ System.Web.UI.WebControls.WebParts;
ใช้ System.Web.UI.HtmlControls;
ใช้ AjaxPro;
/***////// <สรุป>
/// คำอธิบายโดยสรุปสำหรับ AjaxMethod
/// </สรุป>
AjaxMethod คลาสสาธารณะ
-
AjaxMethod สาธารณะ ()
-
-
// สิ่งที่ต้องทำ: เพิ่มตรรกะคอนสตรัคเตอร์ที่นี่
-
-
[AjaxMethod (HttpSessionStateRequirement.ReadWrite)]
ชุดข้อมูลสาธารณะ GetSubCategory แบบคงที่ (int iCategoryID)
-
string sql = string.Format("SELECT CategoryID, CategoryName, FatherID, dbo.IsLeaf(CategoryID) as IsChild FROM Category WHERE FatherID = {0}", iCategoryID);
กลับ GetDataSet(sql);
}
[AjaxMethod(HttpSessionStateRequirement.ReadWrite)]
ชุดข้อมูลสาธารณะ GetFormsList แบบคงที่ (int iCategoryID)
-
string sql = string.Format("SELECT * FROM form WHERE form_category_id = {0}", iCategoryID);
กลับ GetDataSet(sql);
-
สตริงคงที่สาธารณะ ConnectionString = ConfigurationSettings.AppSettings ["ConnectionString"].ToString();
ชุดข้อมูลคงที่สาธารณะ GetDataSet (สตริง sql)
-
SqlDataAdapter sda = SqlDataAdapter ใหม่ (sql, ConnectionString);
ชุดข้อมูล ds = ชุดข้อมูลใหม่ ();
sda.เติม(ds);
ถ้า (ds != null)
กลับds;
อื่น
กลับเป็นโมฆะ;
-
}5.sql脚本
ถ้ามี (เลือก * จาก dbo.sysobjects โดยที่ id = object_id(N'[dbo].[Category]') และ OBJECTPROPERTY(id, N'IsUserTable') = 1)
วางตาราง [dbo].[หมวดหมู่]
ไป
ถ้ามี (เลือก * จาก dbo.sysobjects โดยที่ id = object_id(N'[dbo].[Forms]') และ OBJECTPROPERTY(id, N'IsUserTable') = 1)
วางตาราง [dbo].[แบบฟอร์ม]
ไป
สร้างตาราง [dbo].[หมวดหมู่] (
[CategoryID] [int] ตัวตน (1, 1) ไม่เป็นโมฆะ
[CategoryName] [varchar] (20) COLLATE Chinese_PRC_CI_AS NULL ,
[FatherID] [int] NULL
) เปิด [หลัก]
ไป
สร้างตาราง [dbo].[แบบฟอร์ม] (
[FormID] [int] ตัวตน (1, 1) ไม่เป็นโมฆะ
[FormName] [nvarchar] (50) COLLATE Chinese_PRC_CI_AS NULL ,
[FormUrl] [nvarchar] (50) COLLATE Chinese_PRC_CI_AS NULL ,
[Form_category_id] [int] NULL ,
[เป้าหมาย] [ถ่าน] (10) COLLATE Chinese_PRC_CI_AS NULL
) เปิด [หลัก]
ไป
สร้างฟังก์ชัน IsLeaf (@cat_id int)
ส่งคืน int AS
BEGIN
ประกาศ @count int
เลือก @count = (เลือก count(*) จาก Category โดยที่ FatherID=@cat_id )
ถ้า (@count=0)
กลับ 1
กลับ 0
จบ