在客户端复制 AJAX 控制工具包 CascadingDropDown答案

【问题标题】：Copy AJAX Control Toolkit CascadingDropDown on client在客户端复制 AJAX 控制工具包 CascadingDropDown
【发布时间】：2014-08-18 11:05:12
【问题描述】：

我想通过 javascript (jQuery) 在客户端复制一个级联下拉列表。

您可以在第一个框中看到要复制的级联下拉列表。它们将使用 AJAX 控件工具包的 CascadingDropDown 控件在 ASP.NET 中呈现。这非常有效。

当您单击“添加其他类别”时，第一个框的所有下拉列表都将被复制。（见第二个方框）

这是这个动作的点击脚本（使用jQuery的clone()）：

categoryRow.clone(true, true).insertBefore(containerRow);
subCategory1Row.clone(true, true).insertBefore(containerRow);
subCategory2Row.clone(true, true).insertBefore(containerRow);
subCategory3Row.clone(true, true).insertBefore(containerRow);

clone() 函数还复制 CascadingDropDown 控件的隐藏 ClientState 字段。

很遗憾，复制的 CascadingDropDownLists 的级联功能不起作用。

如何最好地创建/复制级联 drodwownlists？或者您有任何其他想法/更好的方法来做到这一点？

【问题讨论】：

我担心在这种情况下复制 DOM 将不起作用。您需要在回发中将另一组 cascadingdropdowns 添加到页面的 Controls 集合中。为方便起见，我建议创建一个 CategoryControl.ascx。
级联功能消失的原因是因为我相信当您复制下拉列表时，ID 也会被复制。使用 jQuery 在 DOM 中有多个 id 是一个很大的禁忌。

标签： javascript jquery asp.net ajaxcontroltoolkit cascadingdropdown

【解决方案1】：

“很遗憾，复制的 CascadingDropDownLists 的级联功能不起作用”

那是因为原始元素也注册了事件侦听器...复制的元素确实被复制了，但是没有那些侦听器。

你怎么检查它？在任何现代浏览器（我更喜欢 chrome）中，您都可以在输入开发工具时查看 HTML 页面的元素（按 F12 启动）。每个元素都有一个活跃的听众地图。

简而言之：找到用于首先为原始元素定义事件的函数 - 然后使用此函数注册新复制的元素。

请确保不要多次注册原始元素。这将导致每个事件针对每个元素触发多次。

【讨论】：

嗨 Nagelfar 感谢您的信任 :) 您介意编辑您的原始帖子并分享一些代码行吗？它可能会帮助稍后将观看此帖子的用户