`
zhouxin464585932
  • 浏览: 80419 次
  • 性别: Icon_minigender_1
  • 来自: 南京
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

DHTMLX Tree示例

阅读更多

前台代码:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SelectLinkman.aspx.cs"
Inherits="SMSPlatform.SelectLinkman" %>

<!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 id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=7" />
<title>选择联系人</title>
<link rel="STYLESHEET" type="text/css" href="JavaScript/TreeCodebase//dhtmlxtree.css" />
<script src="JavaScript/jquery.js" type="text/javascript" language="javascript"></script>

<script src="JavaScript/TreeCodebase/dhtmlxcommon.js" type="text/javascript"></script>
<script src="JavaScript/TreeCodebase/dhtmlxtree.js" type="text/javascript"></script>
</head>
<body style="margin: 0px;padding: 0px;background-color: #338888;">
<form id="form1" runat="server">
<div style="background-color: White; width: 600px; margin: 0,auto;">
<asp:Label ID="MyLinkName" runat="server" Text=""></asp:Label>
</div>

<div id="treeboxbox_LinkManPhoneTree" style="width:250; height:218;background-color:#f5f5f5;border :1px solid Silver;"></div>
<div style="margin-top: 30px; margin-bottom: 30px; width: 600px; margin: 0,auto; text-align:center">
<input id="SelectLinkName" type="button" style="text-align:center" value="确定选择" onclick="return GetPhone();" /></div>
<script language="javascript" type="text/javascript">
$(LoadPhonelist()); //页面初始化函数
//页面初始化函数
function LoadPhonelist()
{
$.ajax({
type: "POST",
url: "SelectLinkman.aspx",
data: "location=local",
success: LoadPhonelistSuccess
});
}
//页面初始化回调函数
function LoadPhonelistSuccess(r)
{
LinkManPhoneTree = new dhtmlXTreeObject("treeboxbox_LinkManPhoneTree", "100%", "100%", 0);
LinkManPhoneTree.setImagePath("JavaScript/TreeCodebase/imgs/csh_bluebooks/");
LinkManPhoneTree.enableCheckBoxes(1);
LinkManPhoneTree.enableThreeStateCheckboxes(true);
LinkManPhoneTree.loadXMLString(r);
}
//取得用户所选择的电话号码
function GetPhone()
{
var StrPhone = "";
var Phones = LinkManPhoneTree.getAllChecked();
var phone = Phones.split(",");
for (var i = 0; i < phone.length; i++)
{
var a = phone[i];
if (a.length < 11)
{
StrPhone = StrPhone;
}
else if (a.length == 11)
{
if (StrPhone.length == 0)
{
StrPhone = a;
}
else
{
StrPhone = StrPhone + "|" + a;
}
}
else
{
if (StrPhone.length == 0)
{
StrPhone = a;
}
else
{
StrPhone = StrPhone + "|" + a.substring(0, 11);
}
}
}
if (StrPhone.length == 0)
{
if (confirm("您还没有选择联系人,是否继续?") == true)
{
window.returnValue = StrPhone.substr(0, StrPhone.length);
window.close();
}
}
else
{
if (confirm("是否继续?") == true)
{
window.returnValue = StrPhone.substr(0, StrPhone.length);
window.close();
}
}
}
</script>
</form>
</body>
</html>
后台代码:

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Text;
using System.Xml.Linq;
using WXRT.SMS.DAL;
using WXRT.SMS.BLL;

namespace SMSPlatform
{
public partial class SelectLinkman : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Request["location"] != null)
{
string Staction = Request["location"].ToString();
if (Session["UserID"] == null || Session["UserID"].ToString() == "")
{
ScriptManager.RegisterStartupScript(this.Page, GetType(),
"askAndRederect", "alert('请先登录!');window.location.href='Index.aspx';", true);
}

if (Staction == "local")
{

int CustomerID = Convert.ToInt32(Session["UserID"].ToString());

GetCardGroup(CustomerID);

}
}
}
/// <summary>
/// 创建人:周昕
/// 创建时间:2009-7-18
/// 方法名称:GetCardGroup
/// 作用:生成XML数据用于生成Tree
/// </summary>
/// <param name="CustomerID">用户ID</param>
public void GetCardGroup(int CustomerID)
{
StringBuilder str = new StringBuilder();
CustomerBLL bll = new CustomerBLL();
DataTable dt = bll.GetGroup(CustomerID);
str.Append("<?xml version='1.0' encoding='utf-8'?><tree id='0'><item text='联系人' open='0' id='10000' call='1' select='1'>");
if (dt.Rows.Count > 0)
{
for (int i = 0; i < dt.Rows.Count; i++)
{

DataTable carDt = bll.GetNameCard(Convert.ToInt32(dt.Rows[i][0].ToString()));
str.Append(" <item text='" + dt.Rows[i][1].ToString() + "' id='" + (i+1).ToString() + "' im0='tombs.gif' im1='tombs.gif' im2='iconSafe.gif' call='1' select='1'>");
if (carDt.Rows.Count > 0)
{
for (int j = 0; j < carDt.Rows.Count; j++)
{
str.Append("<item text='" + carDt.Rows[j][1].ToString()+"|"+carDt.Rows[j][2].ToString() + "' id='" + carDt.Rows[j][2].ToString() + "' im0='folderClosed.gif' im1='folderOpen.gif' im2='folderClosed.gif'></item>");
}
str.Append("</item>");
}
else
{
str.Append("<item text='暂无联系人' id='' im0='folderClosed.gif' im1='folderOpen.gif' im2='folderClosed.gif'></item>");
str.Append("</item>");
}

}

}
else
{
this.MyLinkName.Text = this.MyLinkName.Text + "<div style=\"height:30px;width:100%;background-color:#efefef;line-height:30px;text-align:left;color:blue\">暂无联系人</div>";
}
str.Append("</item>");
str.Append("</tree>");
Response.Clear();
Response.ContentType = "application/text";
Response.Write(str);
Response.End();
}
}
}

图片效果:

展开效果:

全选效果:

部分选择效果:

点确定的时刻我们会向页面传递所有的手机号码:

如下图所示

分享到:
评论

相关推荐

    DHTMLX tree中文帮助文档

    根据提供的文件信息,本文将对DHTMLX Tree的相关知识点进行详细的阐述。 ### DHTMLX Tree 概述 DHTMLX Tree 是一个强大的JavaScript库的一部分,该库提供了多种UI组件来帮助开发者快速构建复杂的Web应用程序。其中...

    DHTMLX Tree强大的树插件

    DHTMLX Tree是一款功能强大的JavaScript树形控件,它允许开发者在Web应用程序中创建交互式、可自定义的树状视图。这个组件是DHTMLX Suite的一部分,它是一个广泛使用的JavaScript UI库,用于构建富客户端应用。...

    DHTMLX一个Tree组建,相当好用的树组建

    通过这些文件,开发者可以直接在自己的项目中引入和使用DHTMLX Tree,或者参考示例来学习如何配置和操作这个组件。 总的来说,DHTMLX Tree组件以其丰富的功能、高效的性能和良好的扩展性,成为了开发Web应用程序时...

    dhtmlx-dept-tree-demo

    【dhtmlx-dept-tree-demo】是一个基于dhtmlx库实现的示例,它展示了如何用JSON格式的部门数据构建一个交互式的树形结构,并在该结构上进行编辑操作。这个例子特别适用于需要管理和展示组织架构或者部门层级关系的...

    dhtmlxTree

    **DHTMLX Tree组件详解** DHTMLX Tree是一款强大的JavaScript组件,它允许开发者在Web应用程序中轻松地创建和管理交互式的树形结构。这个组件以其灵活性、易用性和丰富的功能集而闻名,使得生成和操作树形数据变得...

    DHTMLX-SAMPLE

    3. **DHTMLX Tree**:它提供了可折叠的节点结构,适用于展现层次化数据。示例可能会包含如何创建和操作树,以及如何添加拖放功能。 4. **DHTMLX Layout**:这是一个用于创建复杂布局的组件,可以创建带有多个面板的...

    dhtmlx-2.5-pro.rar

    【标签】"dhtmlx tree pro 专业版" 指出dhtmlx框架中的一个组件——dhtmlxTree,这是一个用于创建交互式树形结构的工具,适用于组织数据和导航。专业版通常意味着它包括更多的特性和高级功能,比如更完善的技术支持...

    dhtmlx3.5企业专业版

    随着dhtmlx35.chm文件的提供,开发者可以查阅详细的API文档和示例代码,同时DHTMLX有一个活跃的开发者社区,可以寻求问题解答和分享经验。 总结来说,DHTMLX 3.5企业专业版是一个强大且全面的前端框架,具备丰富的...

    用Dhtmlx做的例子

    在“Dhtmlx实例”这个压缩包中,你可能会找到一些预设的示例代码,这些代码演示了如何在实际项目中使用这些组件。通过分析和学习这些例子,你可以了解如何初始化组件、设置属性、响应用户交互以及如何与后端数据源...

    dhtmlxTreeGrid1.2_Pro

    在实际应用中,开发者可以利用dhtmlxTreeGrid1.2_Pro提供的示例和文档,快速集成到自己的项目中,通过配置和编写JavaScript代码实现特定的功能。在压缩包内的文件中,通常会包含库文件、样例代码、帮助文档等,这些...

    《DHTMLX中文使用手册》PDF

    - DHTMLX提供了一系列内置组件,如表格(grid)、树形结构(tree)、图表(chart)、日历(calendar)等,满足不同应用场景的需求。 - 这些组件具有高度可定制性,可以轻松地通过CSS进行样式调整,从而适应不同的设计风格...

    dhtmlx-grid分页-示例,后台java调用

    这个工程是免费的(也可以认为开源) 里面使用了dhtml tree grid 很多地方用了tree 而grid目前只剩下角色管理列表了 后续也不想再用grid了 你可以参考 如果不想麻烦 那么就接着往下看 4 在它的免费版中(就是可以...

    DHTMLXTree中文开发指导.pdf

    DHTMLX Tree是一款用于Web开发的专业JavaScript组件,主要用于构建可交互的树形结构,它具有良好的跨浏览器和跨平台兼容性。此组件适用于多种服务器端技术,如Macromedia Cold Fusion、JSP和ASP.NET。DHTMLX Tree的...

    DHTMLX 5 CHM API文档

    1. **组件介绍**:DHTMLX包含多种组件,如Grid、Tree、Chart、Scheduler等,每个组件都有详细的API说明,涵盖创建、配置、操作和事件处理。 2. **对象和方法**:API文档详细列出了每个组件的所有可用对象和方法,...

    dhtmlxtree_servlet_src

    DHTMLX Tree是一个JavaScript库,它可以与后台的Servlet进行通信,动态加载和管理树状结构的数据。Servlet在这里起到了服务器端数据处理和传输的角色,它接收前端的请求,处理数据,然后返回给前端展示。这种结合...

    dhtmlx学习资料

    提供的"**dhtmlx.pdf**"文件很可能是dhtmlx的官方文档,其中包含了详细的技术指南、示例代码和API参考。阅读这份文档将帮助你深入理解dhtmlx各组件的用法和配置,加快学习进度。 总之,dhtmlx是一个功能强大的...

    dhtmlxGantt 介绍以及使用说明

    下面是一个简单的 Vue.js 组件示例,展示了如何在 Vue 项目中使用 dhtmlxGantt: ```javascript &lt;div ref="gantt"&gt;&lt;/div&gt; import 'dhtmlx-gantt'; export default { name: 'gantt', props: { tasks: { ...

    dhtmlx4.0包

    包中的“samples”目录提供了dhtmlx组件的实际应用示例,开发者可以通过查看和运行这些示例快速理解如何在自己的项目中集成和使用这些组件。这些示例通常包括基本用法、复杂配置以及与其他组件的交互。 3. **文档...

    dhtmlx中文使用手册

    - Tree的拖放操作示例,以及如何监听拖放事件来处理数据的移动或复制。 **四、集成与扩展** dhtmlx与AJAX、PHP、ASP.NET、Java等多种后端技术兼容,手册将解释如何建立前后端通信,实现数据的动态加载和保存。同时...

    dhtmlx 文档 英文版

    1. **组件介绍**:详细介绍了dhtmlx提供的各种组件,如Grid(表格)、Tree(树形结构)、Scheduler(日历)、Charts(图表)等。每个组件都会讲解其基本用法、API接口、事件处理以及如何自定义样式和行为。 2. **...

Global site tag (gtag.js) - Google Analytics