Использование AjaxPro для разработки четырехуровневого раскрывающегося списка необновляемых связей.

Автор：Eve Cole Время обновления：2009-07-06 16:39:16

Среда разработки VS.NET 2005 C# Oracle AjaxPro

В последнее время я был занят, и у меня нет времени объяснять подробно, поэтому я опубликую общий исходный код, чтобы убедиться в этом сам.

По соображениям производительности уровни провинции и города записываются как массивы JS, а уровни округа и района (города) записываются в Oracle. Запустите C# для чтения базы данных через JS, затем передайте данные обратно в JS и затем привяжите их для отображения.

Операция <select> использует более общий метод createElement() вместо использования options.add().

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Area.aspx.cs" Inherits="Area" %>

<!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="сервер">
<title>Регион</title>
</голова>
<тело>
<form id="form1" runat="server">
<таблица>
<тр>
<тд>
<select id="SF">
<option selected="selected">—Пожалуйста, выберите—</option>
</выбрать>
</td>
<тд>
<выбрать идентификатор="CS">
<option selected="selected">—Пожалуйста, выберите—</option>
</выбрать>
</td>
<тд>
<select id="Сиань">
<option selected="selected">—Пожалуйста, выберите—</option>
</выбрать>
</td>
<тд>
<select id="Чжэнь">
<option selected="selected">—Пожалуйста, выберите—</option>
</выбрать>
</td>
</tr>
</table>

//Создаем раскрывающийся список через DOM http://www.downcodes.com/qq.asp
//obj: набор данных опций раскрывающегося списка
//id: идентификатор раскрывающегося списка
функция CreateDropDownList(obj,id)
...{
вар sel=document.getElementById(id);
sel.options.length=1 //Сохранить «—Пожалуйста, выберите—»;
//Хранилище массивов обычно используется для провинций и городов, а C# — для чтения из базы данных для округов и городов.
если (obj == null) return;
если (объект экземпляра массива)
...{
for(var i=0;i<obj.length;i++)
...{
var op=document.createElement("опция");
op.setAttribute("значение",obj[i][0]);
var txt=document.createTextNode(obj[i][1]);
op.appendChild (txt);
sel.appendChild(оп);
}
}
еще
...{
for(var i=0;i<obj.Rows.length;i++) //Обратите внимание, что это длина, а не количество
...{
var op=document.createElement("опция");
op.setAttribute("value",obj.Rows[i].ID); //Обратите внимание, что он чувствителен к регистру
var txt=document.createTextNode(obj.Rows[i].NAME); //Имена столбцов корневой таблицы DataTable должны быть согласованными
op.appendChild (txt);
sel.appendChild(оп);
}
}
//Привязываем следующий раскрывающийся список
переключатель (идентификатор)
...{
case "SF":sel.onchange=function()......{ClearXianZhen();CreateDropDownList(GetArray(this.value),"CS");};break;
case "CS":sel.onchange=function()......{ClearZhen();CreateDropDownList(Area.GetDataTable(this.value,AreaEnum.Xian).value,"Xian");};break / /JS передает параметры C# и получает возвращаемое значение C#.
case "Xian":sel.onchange=function()...{CreateDropDownList(Area.GetDataTable(this.value,AreaEnum.Zhen).value,"Zhen");};break; //Возвращаемое значение.
default:sel.onchange=function()......{alert(this.value);};break;
}
}

//Запись выполнения
вар arr=GetArray("0");
CreateDropDownList(arr,"SF");

//Получаем необходимый массив
//tar=ID провинции, к которой он принадлежит
функция GetArray(val)
...{
вар темп = новый массив ();
вар j=0;
for(var i=0;i<aDQ.length;i++)
...{
if(aDQ[i][2].toString()==val)
...{
temp[j]=aDQ[i];
//temp[j].push(aDQ[i]);
j++;
}
}
температура возврата;
}

//Очистим раскрывающийся список «Город»
функция ОчиститьЖен()
...{
CreateDropDownList(null, «Чжэнь»);
}
//Очистим раскрывающиеся списки «Округ» и «Город»
функция ClearXianZhen()
...{
CreateDropDownList(null, «Сиань»);
CreateDropDownList(null, «Чжэнь»);
}

</script>

</form>
</тело>
</html>

использование системы;
использование System.Data;
использование System.Data.OracleClient

Область публичного частичного класса: System.Web.UI.Page;
...{
protected void Page_Load (отправитель объекта, EventArgs e)
...{
//Регистрируем классы и перечисления C# в JS соответственно
AjaxPro.Utility.RegisterTypeForAjax(typeof(Area));
AjaxPro.Utility.RegisterEnumForAjax(typeof(AreaEnum));
}

/**//// <сводка>
/// Получаем данные, необходимые из раскрывающегося списка
/// </сводка>
/// <param name="UpID">Идентификатор верхнего уровня</param>
/// <param name="ae">Округ/Город</param>
/// <returns>Вернуть таблицу данных</returns>
[AjaxPro.AjaxMethod]
public DataTable GetDataTable (строка UpID, AreaEnum ae)
...{
если (String.IsNullOrEmpty(UpID))
вернуть значение null

string link = "server=XXX;user=XXX;pwd=XXX;";
OracleConnection conn = new OracleConnection(link);

//Все имена столбцов в DataTable, возвращаемые Oracle, написаны заглавными буквами при получении значений на странице.
строка SQL;
если (Enum.Equals(ae, AreaEnum.Xian))
sql = "ВЫБЕРИТЕ идентификатор, имя ИЗ города, где ТРИИД = 0 И ДВА = = + UpID;
еще
sql = «ВЫБЕРИТЕ идентификатор, имя ИЗ города ГДЕ ТРИИД =» + UpID

адаптера OracleDataAdapter = новый OracleDataAdapter (sql, conn);
Таблица DataTable = новый DataTable();
адаптер.Заполнить(таблица);
возвратный стол;
}
}

/**//// <сводка>
/// Перечисление регионов
/// </сводка>
общедоступное перечисление AreaEnum
...{
/**//// <сводка>
/// округ
/// </сводка>
Сиань,
/**//// <сводка>
/// город
/// </сводка>
Чжэнь
}

На этом этапе реализованы основные функции, а также есть некоторые функции (определение региона через имя доменаIP и прямая привязка, сохранение выбранного региона, удобное чтение/сохранение информации о городе для осуществления контроля и т.д.). Я закончу, когда у меня будет время.

Не забудьте добавить

в <system.web> файла Web.config.