ASP中的Treeview控件.net

我的web应用程序中有一个treeview控件。我动态地构建了这个树视图。ASP中的Treeview控件.net

是否有无论如何选择一个节点，并改变所选节点的颜色使用JavaScript或任何其他方法运行在客户端（我的意思是没有回发）。

我使用C＃和asp.net到bulid我的应用程序

2010-10-05 Null Pointer

没有答复却:( – 2010-10-05 08:39:02

EDIT（要解释一下jQuery的）：
JQuery是一个.js包含JavaScript函数的文件，以便于浏览文档，选择DOM元素，创建动画，处理事件和开发Ajax应用程序。

您可以从JQuery official website下载的jquery.js文件，然后参照的jquery.js文件（如你参考其他.js文件）你叫你的第一个jQuery脚本之前，如下：

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

或者，您也可以使用JQuery.js file hosted by Google。这是我为我的测试所做的。下面是我的.aspx页面的完整代码：。

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

<!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="server"> 
    <title></title> 

    <script type="text/javascript" 
     src="http://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
     // You may specify partial version numbers, such as "1" or "1.3", 
     // with the same result. Doing so will automatically load the 
     // latest version matching that partial revision pattern 
     // (e.g. 1.3 would load 1.3.2 today and 1 would load 1.4.2). 
     google.load("jquery", "1.4.2"); 

     google.setOnLoadCallback(function() { 
      // Place init code here instead of $(document).ready() 

      //change cursor to hand when user mouseover tree nodes 
      $(".TreeView1_0").mouseover(function() { 
       $(this).css('cursor', 'pointer'); 
      }); 


      //unbold all nodes then bold the selected node to indicate it's selected 
      $(".TreeView1_0").click(function() { 
       $(".TreeView1_0").css('font-weight', 'normal'); 
       $(this).css('font-weight', 'bold'); 
      }); 
     }); 
    </script> 

</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:TreeView ID="TreeView1" runat="server"> 
     </asp:TreeView> 
    </div> 
    </form> 
</body> 
</html>

来源

2010-10-06 14:30:19 bla

哇。它真的很棒。谢谢李。但我还有一个疑问。我有一个form.and上的按钮，我只想获得选定的节点value.its只是一个例子 - > protected void Button1_Click（object sender，EventArgs e） { Button1.Text = TreeView1.SelectedNode.Value; } 但它给出了这样的错误 - >对象引用未设置为对象的实例。是否有任何方法可以解决这个问题？再次尝试 – 2010-10-07 06:24:08

当您通过将选择操作设置为'无'来删除超链接时，当您单击该节点时，该页面将不会执行回发。因此，没有数据发布到服务器，服务器将不知道当前选择的节点是什么。您必须进一步解决您的代码，例如在页面中放置隐藏字段。我宁愿建议你在这种情况下使用Ajax UpdatePanel，而不是做这么多解决方法:) – bla 2010-10-07 07:20:28

谢谢。现在我正在搜索隐藏字段：D。你帮了我很多 – 2010-10-07 07:36:28

2种方式我能想到的来实现这一点：

总结使用Ajax的UpdatePanel您的TreeView。这更直截了当。
使用递归函数从树节点中删除超链接，然后使用JQuery将客户端单击事件绑定到所有节点。

更多细节对于方法2作为随后..

将树形控制到aspx页面

<asp:TreeView ID="TreeView1" runat="server"> </asp:TreeView>

添加虚拟节点，并调用递归函数以去除超链接

protected void Page_Load(object sender, EventArgs e) 
{ 
    if (!IsPostBack) 
    { 
     //add dummy nodes 
     TreeView1.Nodes.Add(new TreeNode() { Value = "1", Text = "One" }); 
     TreeView1.Nodes.Add(new TreeNode() { Value = "2", Text = "Two" }); 
     TreeView1.Nodes.Add(new TreeNode() { Value = "3", Text = "Three" }); 

     //call recursive function to remove hyperlinks 
     RemoveHyperLinks(TreeView1, TreeView1.Nodes); 
    } 
}

实现递归函数

System.Web.UI.WebControls.TreeView RemoveHyperLinks(System.Web.UI.WebControls.TreeView treeView, TreeNodeCollection treeNodes) 
{ 
    foreach (TreeNode node in treeNodes) 
    { 
     node.SelectAction = TreeNodeSelectAction.None;//here the link is removed 
     if (node.ChildNodes != null && node.ChildNodes.Count > 0) 
     { 
      treeView = RemoveHyperLinks(treeView, node.ChildNodes); 
     } 
    } 
    return treeView; 
}

地方aspx页面上此jQuery代码

//change cursor to hand when user mouseover tree nodes 
$(".TreeView1_0").mouseover(function() { 
    $(this).css('cursor', 'pointer'); 
}); 


//unbold all nodes then bold the selected node to indicate it's selected 
$(".TreeView1_0").click(function() { 
    $(".TreeView1_0").css('font-weight', 'normal'); 
    $(this).css('font-weight', 'bold'); 
});

来源

2010-10-05 10:10:05 bla

谢谢李惟独Java代码工作正常 <脚本类型= “文/ JavaScript的”> $（“。TreeView1_0”）。mouseover（function（）{ $（this）.css（'cursor'，'pointer'）; }）; $（“。TreeView1_0”）。click（function ）{（“。TreeView1_0”）.css（'font-weight'，'normal'）; $（this）。css（'font-weight'，'bold'）; }）; 是我放置代码的方式是正确的吗？鼠标悬停并点击功能不能触发。我可以递归删除超链接 – 2010-10-06 11:38:08

您是否引用了jquery.js？ – bla 2010-10-06 11:56:08

另一种可能性是你的树节点的CSS类。我对课程名称进行了硬编码。一个。你的可能不是“TreeView1_0”。 – bla 2010-10-06 11:58:04

ASP中的Treeview控件.net

回答

相关问题