本文记录的是带领成员开发一个小模块功能的时候,需要用到弹出窗口加载树状级联单位选择,最后决定用采用jQuery+EasyUI插件进行开发。但是在使用EasyUI中tree的插件时,碰到了不少麻烦。为了提供弹出树的显示速度,就采用异步加载数节点值,首先先加载根节点,然后根据点击的节点展开加载子节点。
往往结果和预期的都不一样,困惑了几天,展开后子节点是动态加载了,但是收缩后无法清空之前填充的数据;第二次在展开时,子节点又被重复加载了一遍,造成了数据重复显示,并没有提供清除子节点的方法。想尽了各种办法来解决这个问题,只能换另一种形式加载子节点的值了,把每一个节点值保存起来,判断是否已经存在,存在就不在去加载。
两种方法见实例:
页面getTreeNode.ashx返回树节点JSON格式数据:
public class getTreeNode : IHttpHandler,System.Web.SessionState.IRequiresSessionState
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
DataTable dt = (DataTable)context.Session["viewmaintain"];
string parentId = string.Empty;
string resultStr = string.Empty;
string attributes = string.Empty;
string colName = string.Empty;
string sql = string.Empty;
string Casname = string.Empty;
bool colt = false;
string icon = "icon-profile";
if (!string.IsNullOrEmpty(context.Request.QueryString["pid"]))
{
parentId = context.Request.QueryString["pid"].ToString();
}
if ((!string.IsNullOrEmpty(context.Request.QueryString["coln"])) && (string.IsNullOrEmpty(context.Request.QueryString["casn"])))
{
colName = HttpUtility.UrlDecode(context.Request.QueryString["coln"].ToString());
if (dt != null)
{
bool pt = true;
while (pt)
{
for (int i = 0; i < dt.Rows.Count; i++)
{
Casname = dt.Rows[i]["view_colname"].ToString();
if (dt.Rows[i]["view_colname"].ToString() == colName)
{
if (dt.Rows[i]["view_cas"].ToString() != null&&dt.Rows[i]["view_cas"].ToString() !="")
{
colName = dt.Rows[i]["view_cas"].ToString();
}
else
{
colt = true;
sql = dt.Rows[i]["view_sql"].ToString();
pt = false;
}
break;
}
}
}
}
}
if ((!string.IsNullOrEmpty(context.Request.QueryString["casn"])) && (!string.IsNullOrEmpty(context.Request.QueryString["coln"])))
{
string casnName = HttpUtility.UrlDecode(context.Request.QueryString["casn"].ToString());
colName = HttpUtility.UrlDecode(context.Request.QueryString["coln"].ToString());
if (dt != null)
{
for (int i = 0; i < dt.Rows.Count; i++)
{
Casname = dt.Rows[i]["view_colname"].ToString();
if (dt.Rows[i]["view_cas"].ToString() == casnName && casnName != colName)
{
colt = true;
sql = dt.Rows[i]["view_sql"].ToString();
break;
}
}
}
}
try
{
if (parentId != "" && colt == true)
{
//此处省略得到数据列表的代码
List
关键性的代码都已经在上面了,目前也就只能想到这种办法来解决了,有时间的话可以给tree扩展一下,添加一个清除子节点的方法,这样应该实现起来会更容易方便。
小弟在此献丑了,不知道各位专家、同仁有没有遇到类似的问题,或者有其它更好的解决办法,欢迎在这交流。
原文链接:https://www.f2er.com/jquery/56810.html