[英]Remove selected items in the previous selections after cloning into a new dynamically generated dropdownlist
我有一个asp.net下拉列表和一个asp.net按钮控件。 每次单击该按钮时,都会生成一个新的下拉列表,其中包含除先前选择的值以外的所有值。
例如:如果我从值{a,b,c}的列表中选择了'a',然后单击按钮,则应该获得一个新的下拉列表,其值为{b,c}。
虽然,我能够克隆下拉列表的值,但我不知道如何通过删除选定的值来过滤值。
编辑
这是场景
这是我的代码:
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="ddlCityName" runat="server" class="ddlClone" DataTextField="City" DataValueField="City" CssClass=""></asp:DropDownList>
<asp:Button ID="btnClone" runat="server" Text="Clone" />
</div>
<div id="container">
</div>
</form>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("[id*=btnClone]").bind("click", function () {
var index = $("#container select").length + 1;
var ddl = $("[id$=ddlCityName]").clone();
ddl.attr("id", "ddlCityName_" + index);
ddl.attr("name", "ddlCityName_" + index);
$("#container").append(ddl);
$("#container").append("<br /><br />");
return false;
});
});
</script>
您可以获取选定的值并将其从克隆后的新选择中删除,如下所示:
$(ddl).find("option[value='"+selVal+"']").remove();
这是一个运行示例的jsFiddle: https ://jsfiddle.net/ntvo173q/
我更新了jsFiddle以删除所有先前选择的项目,只需签出:
我所做的就是获取所有选定的值并从新的选择中删除:
var ddl = $('#sel').clone();
$('select').each(function() {
$(ddl).find("option[value='"+$(this).val()+"']").remove();
});
解决方法如下:
<script type="text/javascript">
$('#btnClone').click(function () {
var original = $('select.ddlClone(0)');
var allSelects = $('select.ddlClone');
var clone = original.clone();
$('option', clone).filter(function (i) {
return allSelects.find('option:selected[value="' + $(this).val() + '"]').length;
}).remove();
$('#target').append(clone).append('<br /><br /><br />');
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.