旧话重提，如何实现用javascript做的自定义控件

pkkingofice 2004-11-03 05:01:33

.net页面如下，
<%@ Page language="c#" Codebehind="dept_tree.aspx.cs" AutoEventWireup="false" Inherits="XForm.dept_tree" %>
<%@ Import namespace="XForm" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>dept_tree</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<LINK href="_xForm_Library/control.css" type="text/css" rel="stylesheet">
<SCRIPT language="javascript" src="_xForm_Library/client_ini.js"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/MENU.JS"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/TREE.JS"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/basic.js"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/control.js"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/dataset.js"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/table.js"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/DROPDOWN.JS"></SCRIPT>
<SCRIPT language="javascript" src="_xForm_Library/editor.js"></SCRIPT>
<SCRIPT language="javascript" id="clientEventHandlersJS">
function window_onload(){
initDocument();
var rootnode=insertTreeNode(tree_dept, null, "所有");

//insertTreeNode(tree_dept, rootnode, "所有部門");

//insertTreeNode(tree_dept, rootnode, "所有員工","end");

expandTreeNode(tree_dept, rootnode);

var node=rootnode.childNodes.firstUnit;
if (node) expandTreeNode(tree_dept, node);

if (node.childNodes && node.childNodes.firstUnit)
setActiveTreeNode(tree_dept, node.childNodes.firstUnit);
}

function tree_dept_onInitTreeNode(tree, node){
var record=node.record;

switch (node.level){
case 1:{
node.imageUrl="images/global.gif";
break;
}

case 2:{
if (record && !node.inited){
node.label=record.getFieldText("branch_name");
node.branch_id=record.getFieldText("branch_id");
node.inited=true;
}
node.imageUrl="images/branch.gif";
break;
}

case 3:{
if (record && !node.inited){
node.label=record.getFieldText("dept_name");
node.dept_id=record.getFieldText("dept_id");
node.inited=true;
}
node.imageUrl="images/folder.gif";
node.expandImageUrl="images/exfolder.gif";
break;
}

default:{
if (record && !node.inited){
node.label=record.getFieldText("employee_name");
node.dept_id=record.getFieldText("employee_id");
node.inited=true;
}
node.imageUrl="images/folder.gif";
node.expandImageUrl="images/exfolder.gif";
break;
}

}
}
</SCRIPT>
<script language="javascript">
var _processEnterAsTab=true;
</script>
<% string all;
string sql="select * from c_branch";
XForm.CDataSet ds=new CDataSet("dataset_branch",sql,0);
all=ds.init ();
string all1;
string sql1="select * from c_dept";
XForm.CDataSet ds1 =new CDataSet("dataset_dept",sql1,0);
ds1.masterDataset="dataset_branch";
ds1.masterLinks="branch_id";
all1=ds1.init();

string all2;
string sql2="select * from c_employee";
XForm.CDataSet ds2 =new CDataSet("dataset_employee", sql2,0);
ds2.masterDataset="dataset_dept";
ds2.masterLinks="dept_id";
all2=ds2.init();
%>
<%=all%>
<%=all1%>
<%=all2%>
</HEAD>
<BODY bottomMargin="2" leftMargin="2" background="images/bkground.GIF" topMargin="2" scroll="no"
onload="return window_onload()" rightMargin="2">
<DIV title="数据绑定树状列表" style="WIDTH: 100%; HEIGHT: 100%">
<TABLE class="title2" rules="border" width="100%">
<TR>
<TD noWrap> 部门列表
</TD>
<TD align="right"><BUTTON id="Button1" style="BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; WIDTH: 80px; BORDER-BOTTOM: gray 1px solid; HEIGHT: 18px"
type="button" menu="menu_tree" attrib="button">操作</BUTTON>
</TD>
</TR>
</TABLE>
<%
XForm.Tree tree=new Tree ("tree_dept");
tree.rightSelect=true;
tree.dataset2="dataset_branch";
tree.dataset3="dataset_dept";
tree.dataset4="dataset_employee";
string strtree;
strtree=tree.init ();%>
<%=strtree%>
<DIV style="PADDING-RIGHT: 8px; PADDING-LEFT: 8px; FONT-SIZE: 9pt; PADDING-BOTTOM: 8px; PADDING-TOP: 8px">请在上方的树状列表中单击鼠标右键以获取弹出式菜单
<BR>
另外，由于树的子节点是在展开父节点时才从Server端下载的，因此展开树节点的过程稍有迟缓。
</DIV>
</DIV>
</BODY>
</HTML>

里面tree生成的是一个树形的结构，，如何把它封装成.net控件

...全文