Asp.net 드 롭 다운 트 리 의 실현 과정
지식 포인트:ComboTree,일반 처리 프로그램,귀속,JSon
효과
데이터베이스 테이블 디자인:unitmain
노드 클래스 디자인:
public class Unit
{
public decimal id { get; set; }
public string text { get; set; }
public string state { get; set; }
public List<Unit> children { get; set; }
public Unit ()
{
this.children = new List<Unit>();
this.state = "open";
}
}
처리 클래스 디자인:
public class UnitComponent
{
ExeceteOralceSqlHelper SqlHelper= new ExeceteOralceSqlHelper();//
public UnitParent GetUnit()
{
Unit rootUnit = new Unit();
rootUnit.id = 1000;
rootUnit.text = "BO API";
rootUnit.children = GetUnitList(0);
UnitRecursive(rootUnit.children);
return rootUnit;
}
/// <summary>
///
/// </summary>
/// <param name="units"></param>
private void UnitRecursive(List<Unit> units)
{
foreach (var item in units)
{
item.children = GetUnitList(item.id);
if (item.children != null && item.children.Count > 0)
{
item.state = "closed";
UnitRecursive(item.children);
}
}
}
/// <summary>
/// parentID
/// </summary>
/// <param name="parentID"> id</param>
/// <returns> Unit </returns>
private List<Unit> GetUnitList(decimal parentID)
{
List<Unit> unitLst = new List<Unit>();
string sql = string.Format("select hh.unit_id,hh.unit_name from unit_main hh where hh.parent_id={0}", parentID);
DataTable dt = SqlHelper.ExecuteDataTable(sql);// DataTable
if (dt != null && dt.Rows.Count > 0)
{
for (int i = 0; i < dt.Rows.Count; i++)
{
Unit dtup = new Unit()
{
id = Convert.ToInt32(dt.Rows[i]["unit_id"]),
text = dt.Rows[i]["unit_name"].ToString()
};
unitLst.Add(dtup);
}
}
return unitLst;
}
}
다음은 새 웹 프로그램-추가-일반 처리 프로그램 입 니 다.그 중에서 JavaScriptSerializer 는 NewtonSoft 로 바 꿔 서 처리 할 수 있 습 니 다.
public void ProcessRequest(HttpContext context)
{
JavaScriptSerializer js = new JavaScriptSerializer();
context.Response.ContentType = "application/json";
UnitComponent uc = new SynUser.UnitComponent();
var unit = uc.GetUnit();
context.Response.Write("[" + js.Serialize(unit) + "]");
}
이제 이 일반 처리 프로그램 을 테스트 해 보 겠 습 니 다.그림 처럼 결 과 를 되 돌려 주면 정확 합 니 다.자,부서 구조의 데이터 가 준비 되 었 습 니 다.다음 에 프론트 코드 를 쓰기 시작 합 니 다.
aspx 페이지 를 새로 만 들 고 컨트롤 을 끌 어 옵 니 다.
<asp:TextBox ID="tbUnit" runat="server" Width="280px"></asp:TextBox>
상응하는 js 를 도입 하여 script 에 코드 를 추가 합 니 다.
$('#tbUnit').combotree({
url: , '/unit.ashx'
cascadeCheck: true,
placeholder: " ",
method: 'get',
required: true,
multiple: true,
onChange: function (newValue, oldValue) {
computeunit();
},
onLoadSuccess: function (node, data) {
}
});
제 가 선택 한 것 이 응용 관리 서비스 센터,xiaobo,tech 세 노드 인 것 을 발 견 했 는 지 모 르 겠 지만 xiaobo,tech 는 응용 서비스 센터 의 잎 노드 입 니 다.수요 요구 에 따라 저 희 는 응용 관리 서비스 센터 노드 만 얻 고 xiaobo,tech 를 얻 을 필요 가 없습니다.
js 를 통 해 tree 를 옮 겨 다 니 며 우리 가 원 하 는 노드 를 얻 으 려 면 coptute runit 방법 은 우리 가 원 하 는 것 입 니 다.
사고방식 은 다음 과 같다.선 택 된 하위 노드 를 재 귀적 으로 가 져 온 다음 에 선택 한 노드 와 차 집합 을 한다.마지막 으로 얻 은 것 은 선 택 된 노드(전체 선 택 된 하위 노드 는 포함 되 지 않 음)이다.
function computeunit() {
var arr = new Array();
var selectstr = $("#tbUnit").combotree("getValues").toString();
var select = selectstr.split(",");
var t = $('#tbUnit').combotree('tree'); // get the tree object
var n = t.tree('getChecked'); // get selected node
unitrecursive(t, n, arr);
alert(subtraction(select, arr).join(","));
}
/*
**
*/
function subtraction(arr1, arr2) {
var res = [];
for (var i = 0; i < arr1.length; i++) {
var flag = true;
for (var j = 0; j < arr2.length; j++) {
if (arr2[j] == arr1[i]) {
flag = false;
}
}
if (flag) {
res.push(arr1[i]);
}
}
return res;
}
/*
** arr
*/
function unitrecursive(t, nodes, arr) {
for (var i = 0; i < nodes.length; i++) {
if (!t.tree('isLeaf', nodes[i].target)) {
var nn = t.tree('getChildren', nodes[i].target);
for (var j = 0; j < nn.length; j++) {
arr.push(nn[j].id);
}
unitrecursive(t, nn, arr);
}
}
}
이상 은 ASP.NET 이 드 롭 다운(Easy UI ComboTree)을 실현 하 는 모든 아이디어 이 며 여러분 의 학습 에 도움 이 되 기 를 바 랍 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
vue Treeselect 드 롭 다운 트 리 는 N 급 요소 구현 코드 만 선택 할 수 있 습 니 다.오늘 프로젝트 에서 필요 한 것 이 있 습 니 다.바로 vue 드 롭 다운 트 리 는 세 번 째 옵션 만 선택 할 수 있 습 니 다.이 문 제 를 해결 하기 위해 공식 문 서 를 찾 아 보 았 습 니 다. el-tr...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.