求树型下拉框???

huhongf88 2008-09-17 02:25:08
如何在DropDownList控件里以树型结构显示数据?
...全文
103 13 打赏 收藏 转发到动态 举报
写回复
用AI写文章
13 条回复
切换为时间正序
请发表友善的回复…
发表回复
huhongf88 2008-09-17
  • 打赏
  • 举报
 回复
上面的例子"创建控件时出错,未知服务器标识iewc:treeview"???????
tian_fang 2008-09-17
  • 打赏
  • 举报
 回复
都是高人啊，学习下
andrewsway 2008-09-17
  • 打赏
  • 举报
 回复
如果你用的是泛型就相当好解决，在绑定之前，最好是业务处理的时候，根据项之间的关系，在项前面加上空格（一定要中文状态下全角的）就行了
zhong2006 2008-09-17
  • 打赏
  • 举报
 回复
treelist.js 文件里代码


function documentclick()

{

   var TagName=window.event.srcElement.tagName;

  

   if (TagName=="BUTTON")

   {

       var GlobalDropId=window.event.srcElement.id;

       var findexof=GlobalDropId.indexOf('[');

       var lindexof=GlobalDropId.indexOf(']_');

       var id= GlobalDropId.substring(lindexof+2,GlobalDropId.length-findexof);

       GlobalId=id;

   }

   var other=false;

   

   var offsetParent1=window.event.srcElement;

   if (offsetParent1.id=="Tree_div")

       other=true;

   while (offsetParent1.offsetParent)

   {

   

       offsetParent1=offsetParent1.offsetParent;

       if (offsetParent1.id=="Tree_div")

          other=true;

          

       if (offsetParent1.id=="Calendar_div")

         other=true;  

   }

   

   if (window.event.srcElement.id!=GlobalDropId && window.event.srcElement.id!=GlobalId && !other)

   {

       if ($x("Tree_div")!=null)

         $x("Tree_div").style.visibility="hidden";

       if ($x("Calendar_div")!=null)

        $x("Calendar_div").style.visibility="hidden";

   }

  

}





function $x(fobj)

{

  return document.getElementById(fobj);

}





 function GetObjAbsolutePostion(fobj)

 {

   var obj=document.getElementById(fobj);

   var x=obj.offsetLeft;

   var y=obj.offsetTop;

    while (obj.offsetParent)

    {

     obj=obj.offsetParent;

     x+=obj.offsetLeft;

     y+=obj.offsetTop

    }

    

    var o=new Object();

    o.left=x;

    o.top=y;

    o.width=document.getElementById(fobj).offsetWidth;

    o.height=document.getElementById(fobj).offsetHeight;

    return o;

 }

 

 function SetRelativePosition(fobj,robj)

 {

     

      var obj=GetObjAbsolutePostion(robj);

      

      var Tree_div=document.getElementById(fobj);

      Tree_div.style.left=obj.left+"px";

      Tree_div.style.top=obj.top+obj.height+"px";

   

 } 

 

 function GetId(fobjId)

 {

    

   var findexof=fobjId.indexOf('[');

   var lindexof=fobjId.indexOf(']_');

   var id= fobjId.substring(lindexof+2,fobjId.length-findexof); 

   return id; 

 }

  

  function onNodeClick(TreeViewNodeText)

 {

  var text=TreeViewNodeText;

  var  obj_input;

    if (document.getElementById(GlobalId))

    {

       document.getElementById(GlobalId).value=text;

       document.getElementById("Tree_div").style.visibility="hidden";     

    }

 }



 function SetValueCode(fobj)

 {

   if ($x("Tree_div")==null)

    return; 

   if (GlobalDropId!=fobj.id)

   {

    $x("Tree_div").style.visibility="visible";

    

    GlobalDropId=fobj.id;

  

    var id=GetId(fobj.id);

    GlobalId=id;

    //$x(id).focus();

    SetRelativePosition("Tree_div",id);

       

   }

  

   else

   {

    if ($x("Tree_div").style.visibility=="hidden")

    

      $x("Tree_div").style.visibility="visible";

    else

      $x("Tree_div").style.visibility="hidden"

   }

  

  

 }


class=btnCss 样式！！
.btnCss
{
border-right: darkgray 1px solid;
background-position: center center;
border-top: darkgray 1px solid;
font-size: 12px;
background-image: url(images/desc.gif);
border-left: darkgray 0px solid;
width: 16px;
color: black;
padding-top: 1px;
border-bottom: darkgray 1px solid;
background-repeat: no-repeat;
font-family: 宋体;
height: 21px;
background-color: ghostwhite;
}
zhong2006 2008-09-17
  • 打赏
  • 举报
 回复 


<%@ Register TagPrefix="iewc" Namespace="Microsoft.Web.UI.WebControls" Assembly="Microsoft.Web.UI.WebControls" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<HTML>

  <HEAD>

		<title>gl_quanxian</title>

		<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">

		<meta name="CODE_LANGUAGE" Content="C#">

		<meta name="vs_defaultClientScript" content="JavaScript">

		<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">

		<LINK href="test.css" type="text/css" rel="stylesheet">

		<LINK href="Style.css"type=text/css rel=stylesheet>

		<script src="treelist.js" type=text/javascript></script>

<script language=javascript>

<!--

var GlobalId ;

var GlobalDropId;

var GlobalCalendarId ;

function NodeClick()

{

	Form1.parentid.value=TreeView1.getTreeNode(TreeView1.clickedNodeIndex).getAttribute("ID");

    onNodeClick(TreeView1.getTreeNode(TreeView1.clickedNodeIndex).getAttribute("Text"));    

}

//-->

</script>

</HEAD>

	<body MS_POSITIONING="GridLayout">

		<div align="center">

			<form id="Form1" method="post" runat="server">

				<table cellSpacing="0" cellPadding="0" width="450" border="0">

					<tr>

						<td style="HEIGHT: 45px" vAlign="middle" align="center" colSpan="5"><asp:label id="Label2" runat="server" Font-Size="16px" Width="136px" Height="19px" Font-Bold="True">管理权限</asp:label></td>

					<tr height="70">

						<td align="left" colspan="2" style="WIDTH: 593px; HEIGHT: 46px"><FONT face="宋体"><asp:label id="Label3" runat="server" Font-Size="15px" >所属类别：</asp:label>

<asp:textbox id=sex runat="server" ReadOnly="True"></asp:textbox><BUTTON 

      class=btnCss id=[btn]_sex onclick=SetValueCode(this) 

type=button></BUTTON> 

<asp:button id=Button1 runat="server" Width="69px" Font-Size="14px" Text="查询"></asp:button> 

      <INPUT id=parentid style="WIDTH: 20px; HEIGHT: 21px" type=hidden size=4 

      name=parentid runat="server"></FONT></FONT></td>

						<td style="HEIGHT: 46px" colSpan="3"><FONT face="宋体"> <INPUT onclick="window.open('addpowers.aspx','newtxt','top='+( screen.availHeight - 300 ) / 2+',left='+( screen.availWidth - 400 ) / 2+',width=400,height=300,scrollbars=no,resizable=no,resizable=no')"

									type="button" value="增加权限"></FONT></td>

					</tr>

					<tr height="70">

						<td align="center" colSpan="5"><asp:datagrid id="qxgrid" runat="server" Font-Size="13px" Width="820px" DataKeyField="id" AutoGenerateColumns="False"

								AllowPaging="True" AllowSorting="True" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" BackColor="White" CellPadding="3">

								<FooterStyle ForeColor="#000066" BackColor="White"></FooterStyle>

								<SelectedItemStyle Font-Bold="True" ForeColor="#663399" BackColor="#FFCC66"></SelectedItemStyle>

								<AlternatingItemStyle BackColor="#E7F5FF"></AlternatingItemStyle>

								<ItemStyle ForeColor="#330099" BackColor="White"></ItemStyle>

								<HeaderStyle Font-Size="14px" Font-Bold="True" ForeColor="Black" BackColor="#99CCFF"></HeaderStyle>

								<Columns>

									<asp:BoundColumn DataField="id" ReadOnly="True" HeaderText="编号">

										<HeaderStyle HorizontalAlign="Center" Width="70px"></HeaderStyle>

										<ItemStyle HorizontalAlign="Center"></ItemStyle>

									</asp:BoundColumn>

									<asp:BoundColumn DataField="qx_name" HeaderText="权限名称">

										<HeaderStyle HorizontalAlign="Center" Width="200px"></HeaderStyle>

										<ItemStyle HorizontalAlign="Center"></ItemStyle>

									</asp:BoundColumn>

									<asp:BoundColumn DataField="qx_description" HeaderText="权限描述">

										<HeaderStyle HorizontalAlign="Center" Width="200px"></HeaderStyle>

										<ItemStyle HorizontalAlign="Center"></ItemStyle>

									</asp:BoundColumn>

									<asp:BoundColumn DataField="responsespage" HeaderText="对应页面">

										<HeaderStyle HorizontalAlign="Center" Width="200px"></HeaderStyle>

										<ItemStyle HorizontalAlign="Center"></ItemStyle>

									</asp:BoundColumn>

									<asp:EditCommandColumn ButtonType="LinkButton" UpdateText="更新" HeaderText="编 辑" CancelText="取消" EditText="编辑">

										<HeaderStyle HorizontalAlign="Center" Width="100px"></HeaderStyle>

										<ItemStyle HorizontalAlign="Center"></ItemStyle>

									</asp:EditCommandColumn>

									<asp:ButtonColumn Text="删除" HeaderText="删 除 " CommandName="Delete">

										<HeaderStyle HorizontalAlign="Center" Width="50px"></HeaderStyle>

										<ItemStyle HorizontalAlign="Center"></ItemStyle>

									</asp:ButtonColumn>

								</Columns>

								<PagerStyle Font-Underline="True" HorizontalAlign="Center" ForeColor="#330099" BackColor="#99CCFF"

									Mode="NumericPages"></PagerStyle>

							</asp:datagrid></td>

					</tr>

				</table>

			</form>

		</div>

		<script language=javascript>

        <!--

   document.onmousedown =documentclick;

        //-->

	</script>

<DIV class=Box id=Tree_div><FONT face=宋体>

<iewc:treeview id=TreeView1 onclick=NodeClick() runat="server"></iewc:treeview></FONT></DIV>

	</body>

</HTML>


jiangshun 2008-09-17
  • 打赏
  • 举报
 回复
mark
zhong2006 2008-09-17
  • 打赏
  • 举报
 回复
上面那个东东绝对能实现，我试过！
我姓区不姓区 2008-09-17
  • 打赏
  • 举报
 回复
曾经做过一个，是用AjaxControlToolKit实现的
yagebu1983 2008-09-17
  • 打赏
  • 举报
 回复
见过，还没做过呢！！
关注+学习！！
zhong2006 2008-09-17
  • 打赏
  • 举报
 回复
做个假的DropDownList控件
用个TextBox加Button模仿下拉菜单，利用JS控制树型菜单的显示及位置！
zhong2006 2008-09-17
  • 打赏
  • 举报
 回复 


<asp:textbox id=sex runat="server" ReadOnly="True"></asp:textbox><BUTTON 

      class=btnCss id=[btn]_sex onclick=SetValueCode(this) 

type=button></BUTTON>



<DIV class=Box id=Tree_div><FONT face=宋体>

<iewc:treeview id=TreeView1 onclick=NodeClick() runat="server"></iewc:treeview></FONT></DIV> 







function documentclick()

{

   var TagName=window.event.srcElement.tagName;

  

   if (TagName=="BUTTON")

   {

       var GlobalDropId=window.event.srcElement.id;

       var findexof=GlobalDropId.indexOf('[');

       var lindexof=GlobalDropId.indexOf(']_');

       var id= GlobalDropId.substring(lindexof+2,GlobalDropId.length-findexof);

       GlobalId=id;

   }

   var other=false;

   

   var offsetParent1=window.event.srcElement;

   if (offsetParent1.id=="Tree_div")

       other=true;

   while (offsetParent1.offsetParent)

   {

   

       offsetParent1=offsetParent1.offsetParent;

       if (offsetParent1.id=="Tree_div")

          other=true;

          

       if (offsetParent1.id=="Calendar_div")

         other=true;  

   }

   

   if (window.event.srcElement.id!=GlobalDropId && window.event.srcElement.id!=GlobalId && !other)

   {

       if ($x("Tree_div")!=null)

         $x("Tree_div").style.visibility="hidden";

       if ($x("Calendar_div")!=null)

        $x("Calendar_div").style.visibility="hidden";

   }

  

}





function $x(fobj)

{

  return document.getElementById(fobj);

}





 function GetObjAbsolutePostion(fobj)

 {

   var obj=document.getElementById(fobj);

   var x=obj.offsetLeft;

   var y=obj.offsetTop;

    while (obj.offsetParent)

    {

     obj=obj.offsetParent;

     x+=obj.offsetLeft;

     y+=obj.offsetTop

    }

    

    var o=new Object();

    o.left=x;

    o.top=y;

    o.width=document.getElementById(fobj).offsetWidth;

    o.height=document.getElementById(fobj).offsetHeight;

    return o;

 }

 

 function SetRelativePosition(fobj,robj)

 {

     

      var obj=GetObjAbsolutePostion(robj);

      

      var Tree_div=document.getElementById(fobj);

      Tree_div.style.left=obj.left+"px";

      Tree_div.style.top=obj.top+obj.height+"px";

   

 } 

 

 function GetId(fobjId)

 {

    

   var findexof=fobjId.indexOf('[');

   var lindexof=fobjId.indexOf(']_');

   var id= fobjId.substring(lindexof+2,fobjId.length-findexof); 

   return id; 

 }

  

  function onNodeClick(TreeViewNodeText)

 {

  var text=TreeViewNodeText;

  var  obj_input;

    if (document.getElementById(GlobalId))

    {

       document.getElementById(GlobalId).value=text;

       document.getElementById("Tree_div").style.visibility="hidden";     

    }

 }



 function SetValueCode(fobj)

 {

   if ($x("Tree_div")==null)

    return; 

   if (GlobalDropId!=fobj.id)

   {

    $x("Tree_div").style.visibility="visible";

    

    GlobalDropId=fobj.id;

  

    var id=GetId(fobj.id);

    GlobalId=id;

    //$x(id).focus();

    SetRelativePosition("Tree_div",id);

       

   }

  

   else

   {

    if ($x("Tree_div").style.visibility=="hidden")

    

      $x("Tree_div").style.visibility="visible";

    else

      $x("Tree_div").style.visibility="hidden"

   }

  

  

 }
huguang2yq 2008-09-17
  • 打赏
  • 举报
 回复
.....................
这个确实没遇见过......

dengchenlu 2008-09-17
  • 打赏
  • 举报
 回复
高难度啊
asp.net 树型下拉框 (用户自定义控件)
TreeViwe dropdownlist
Element input树型下拉框的实现代码
主要介绍了Element input树型下拉框的实现代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
SpringBoot项目实战+SpringCoud
本套课程主要是一系列Java项目课程，通过理论加实战的方式，让学习Java的同学深入掌握开发实用技能，每个项目都提供了课件和源码 技术包含： 云盘项目： 1. Java基本语法和面向对象 2. 集合、文件IO、反射、网络编程、多线程、JDBC 3. Swing图形化 员工管理系统： 1. SpringBoot、SpringMVC、MyBatis-Plus等核心框架 2. Vue、Element-UI、Axios等前端技术 权限管理系统在员工管理系统基础上新增： 1. SpringSecurity权限框架 2. RBAC权限管理模式 3. Vue树型控件 SpringCloud课程包含微服务开发的主要组件： 1. Eureka注册中心 2. Config配置中心 3. Zuul服务网关 4. Hystrix熔断器和Ribbon负载均衡 5.OpenFeign服务调用
bootstrap树形下拉框 下拉框树形菜单
bootstrap树控件使用bootstrap-treeview.js树形控件在下拉框select中显示，带树形的下拉框
javascript实现的树型下拉框改进版
发现上一个版本，如果数据顺序颠倒就会出现问题，现在加以改进，
.NET社区

62,041

社区成员

669,051

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见，支持健康理性的辩论和互动，反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧

+ 用AI写文章