1. 建立一个aspx页面
HTML-код
<html xmlns=" http://www.w3.org/1999/xhtml " >
<head id="Head1" runat="server">
<title>小山</title>
<link type="text/css" href="../../Styles/tree_css/tree.css" rel="stylesheet">
</голова>
<тело>
<form id="Form1" runat="server">
<ширина таблицы=100% cellpadding=0 cellpacing=0 border=0>
<группа кол-в>
<ширина столбца=180 />
<столбец />
</colgroup>
<тр>
<тд>
<div class="TreeMenu" id="CategoryTree" style="ширина: 100%; высота: 489 пикселей">
</div>
</td>
<тд>
<iframe id=furl height=20 style="height: 497px; width: 100%;"></iframe>
</td>
</tr>
</таблица>
<script Language="jscript">
функция el(id)
{
вернуть документ.getElementById(id);
}
функция ExpandSubCategory(iCategoryID)
{
вар li_father = el("li_" + iCategoryID);
if (li_father.getElementsByTagName("li").length > 0) //分类已下载
{
ChangeStatus (iCategoryID);
возвращаться;
}
li_father.className = "Открыто";
switchNote (iCategoryID, правда);
AjaxMethod.GetSubCategory(iCategoryID, GetSubCategory_callback);
}
Функция GetSubCategory_callback (ответ)
{
вар dt = ответ.значение.Таблицы[0];
если (dt.Rows.length > 0)
{
вар iCategoryID = dt.Rows[0].FatherID;
}
вар li_father = el("li_" + iCategoryID);
var ul = document.createElement("ul");
for (var i = 0;i < dt.Rows.length;i++)
{
if (dt.Rows[i].IsChild == 1) // 叶子节点
{
вар li = document.createElement("li");
li.className = "Дочерний";
li.id = "li_" + dt.Rows[i].CategoryID;
вар 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;
а.onmouseover = функция()
{
Предварительный просмотр изображения (идентификатор);
};
a.href = "javascript:OpenDocument('" + dt.Rows[i].CategoryID + "');";
a.innerHTML = dt.Rows[i].CategoryName;
}
еще
{
вар li = document.createElement("li");
li.className = "Закрыто";
li.id = "li_" + dt.Rows[i].CategoryID;
вар 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].CategoryName;
}
li.appendChild(img);
li.appendChild(а);
ul.appendChild(ли);
}
li_father.appendChild (ul);
switchNote (iCategoryID, ложь);
}
// 叶子节点的单击响应函数
функция OpenDocument (iCategoryID)
{
// 预加载信息
PreloadFormUrl (iCategoryID);
}
функция PreviewImage(iCategoryID)
{
}
Функция ChangeStatus (iCategoryID)
{
вар li_father = el("li_" + iCategoryID);
if (li_father.className == "Закрыто")
{
li_father.className = "Открыто";
}
еще
{
li_father.className = "Закрыто";
}
}
Функция switchNote (iCategoryID, показать)
{
вар li_father = el("li_" + iCategoryID);
если (показать)
{
var ul = document.createElement("ul");
ul.id = "ul_note_" + iCategoryID;
var note = document.createElement("li");
note.className = "Дочерний";
вар 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);
}
еще
{
вар ul = el("ul_note_" + iCategoryID);
если (ул)
{
li_father.removeChild (ul);
}
}
}
// 加载根节点
var Tree = el("CategoryTree");
var root = document.createElement("li");
root.id = "li_0";
Tree.appendChild(корень);
// 加载页面时显示第一级分类
РазвернутьПодКатегорию (0);
функция PreloadFormUrl (iCategoryID)
{
// 采用同步调用的方式获取图片的信息
вар ds = AjaxMethod.GetFormsList(iCategoryID).value;
// 如果返回了结果
если (дс)
{
// 判断数据表是否不为空
если (ds.Tables[0].Rows.length > 0)
{
// 返回的信息数据表
dt = ds.Tables[0];
el("furl").src = dt.Rows[0].FormUrl;
}
else // 分类下没有
{
}
}
}
</скрипт>
</форма>
</тело>
</html>2.cs代码
использование системы;
использование System.Data;
использование System.Configuration;
использование 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
{
protected void Page_Load (отправитель объекта, EventArgs e)
{
Utility.RegisterTypeForAjax(typeof(AjaxMethod));
}
}3. Загрузите файлtree.css и выберите CSS.
а
{}{
текстовое оформление: нет;
}
а,а: посетил
{}{
цвет:#000;
фон: наследовать;
}
тело
{}{
маржа: 0;
отступ: 20 пикселей;
шрифт: 12 пикселей Tahoma,宋体, без засечек;
}
DT
{}{
размер шрифта: 22 пикселей;
шрифт-вес: жирный;
поле: 0 0 0 15 пикселей;
}
дд
{}{
поле: 0 0 0 15 пикселей;
}
h4
{}{
маржа: 0;
дополнение: 0;
размер шрифта: 18 пикселей;
выравнивание текста: по центру;
}
п
{}{
маржа: 0;
отступ: 0 0 0 18 пикселей;
}
па,па:посетил
{}{
цвет:#00f;
фон: наследовать;
}
.TreeMenu img.s
{}{
курсор: рука;
вертикальное выравнивание: по середине;
}
.TreeMenu ул.
{}{
дополнение: 0;
}
.TreeMenu ли
{}{
стиль списка: нет;
дополнение: 0;
}
.Закрытая ул.
{}{
дисплей: нет;
}
.Дочерние изображения
{}{
фон: нет;
курсор: по умолчанию;
}
#CategoryTree ул.
{}{
поле: 0 0 0 17 пикселей;
}
#CategoryTree изображений
{}{
ширина: 34 пикселей;
высота: 18 пикселей;
}
#CategoryTree .Открытые изображения
{}{
фон:url(skin3/opened.gif) без повтора 0 1px;
}
#CategoryTree .Закрытые изображения
{}{
фон:url(skin3/closed.gif) без повтора 0 1px;
}
#CategoryTree .Child img.s
{}{
фон:url(skin3/child.gif) без повтора 13 пикселей 2 пикселя;
}
#CategoryTree
{}{
плавать: влево;
ширина: 249 пикселей;
граница: 1 пиксель, сплошной #99BEEF;
фон:#D2E4FC;
цвет:наследовать;
поле: 3 пикселя;
отступ: 3 пикселя;
высота: 600 пикселей;
}
4. Использование AjaxMethod.
использование системы;
использование System.Data;
использование System.Data.SqlClient;
использование System.Configuration;
использование 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);
DataSet ds = новый DataSet();
sda.Fill(дс);
если (дс != ноль)
вернуть дс;
еще
вернуть ноль;
}
}5.sql — версия
если существует (выберите * из dbo.sysobjects, где id = object_id(N'[dbo].[Category]') и OBJECTPROPERTY(id, N'IsUserTable') = 1)
удалить таблицу [dbo].[Категория]
GO,
если существует (выберите * из dbo.sysobjects, где id = object_id(N'[dbo].[Forms]') и OBJECTPROPERTY(id, N'IsUserTable') = 1)
удалить таблицу [dbo].[Forms]
СОЗДАТЬ
ТАБЛИЦУ [dbo].[Категория] (
[CategoryID] [int] IDENTITY (1, 1) NOT NULL ,
[CategoryName] [varchar] (20) COLLATE Chinese_PRC_CI_AS NULL ,
[FatherID] [int] NULL
) НА [ОСНОВНОЙ]
ПОЙДИТЕ
СОЗДАТЬ ТАБЛИЦУ [dbo].[Forms] (
[FormID] [int] IDENTITY (1, 1) NOT NULL ,
[ИмяФормы] [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
НАЧАЛО
объявить @count int
select @count = (выберите count(*) из категории, где FatherID=@cat_id )
если (@count=0)
вернуть 1
вернуть 0
КОНЕЦ