[英]angularjs filter drop-down list according to selected values in other drop-down lists
[英]Remove selected entry on other drop-down list
我有2個DropDownList
具有相同的內容(即財務,市場營銷,促銷)。 我想從列表的其余部分中刪除已經選擇的值。
示例:如果我為第一張列表選擇“財務”,則應將其從其他列表中刪除; 第二個列表應僅顯示“市場營銷”和“促銷”。
但是,當在第一個列表中選擇任何值時,當前代碼仍會在其他列表上顯示所有值。
ASP.NET頁面
<asp:DataList ID="dldepart" runat="server" RepeatDirection="Horizontal" RepeatColumns="4" Height="343px" Width="1572px" onitemdatabound="dldepart_ItemDataBound">
<ItemTemplate>
<asp:DropDownList ID="ddlist" runat="server" AutoPostBack="true" onselectedindexchanged="ddlist_SelectedIndexChanged">
</asp:DropDownList>
<asp:CheckBoxList ID="CheckBoxList1" runat="server">
</asp:CheckBoxList>
</ItemTemplate>
</asp:DataList>
ASP.NET C#代碼
private void BindCheckBoxList()
{
DataSet ds = new DataSet();
DataTable dt = new DataTable();
SqlConnection con = new SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=D:\database\personal.mdf;Integrated Security=True;Connect Timeout=30;User Instance=True");
try
{
con.Open();
SqlCommand Cmd = new SqlCommand("SELECT distinct depart FROM datalist", con);
SqlDataAdapter Da = new SqlDataAdapter(Cmd);
Da.Fill(dt);
if (dt.Rows.Count > 0)
{
dldepart.DataSource = dt;
dldepart.DataBind();
}
}
catch (System.Data.SqlClient.SqlException ex)
{
string msg = "Fetch Error:";
msg += ex.Message;
throw new Exception(msg);
}
finally
{
con.Close();
}
}
protected void dldepart_ItemDataBound(object sender, DataListItemEventArgs e)
{
DropDownList ddlist = (DropDownList)e.Item.FindControl("ddlist");
DataSet ds = new DataSet();
DataTable dt = new DataTable();
SqlConnection con = new SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=D:\database\personal.mdf;Integrated Security=True;Connect Timeout=30;User Instance=True");
try
{
con.Open();
SqlCommand Cmd = new SqlCommand("SELECT distinct depart FROM datalist", con);
SqlDataAdapter Da = new SqlDataAdapter(Cmd);
/**codes that i used to repeat datalist **/
Da.Fill(dt);
if (dt.Rows.Count > 0)
{
ddlist.DataSource=dt;
ddlist.DataTextField="depart";
ddlist.DataValueField="depart";
ddlist.DataBind();
ddlist.Items.Insert(0, "Select");
ddlist.Items.FindByText("Select").Value = Convert.ToString(0);
}
}
catch (System.Data.SqlClient.SqlException ex)
{
}
finally
{
con.Close();
}
}
在SelectedIndexChange上
protected void ddlist_SelectedIndexChanged(object sender, EventArgs e)
{
DataListItem dlitem = (DataListItem)((DropDownList)sender).Parent;
CheckBoxList CheckBoxList1 = (CheckBoxList)dlitem.FindControl("CheckBoxList1");
DropDownList ddlist = (DropDownList)dlitem.FindControl("ddlist");
// DataBoundControl DataSource = (DataBind)dldepart.FindControl("DataSource");
DataSet ds = new DataSet();
DataTable dt = new DataTable();
SqlConnection con = new SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=D:\database\personal.mdf;Integrated Security=True;Connect Timeout=30;User Instance=True");
try
{
con.Open();
SqlCommand Cmd = new SqlCommand("SELECT Id,subDepatment FROM datalist where depart='" + ddlist.SelectedItem.Text + "'", con);
SqlDataAdapter Da = new SqlDataAdapter(Cmd);
Da.Fill(dt);
if (dt.Rows.Count > 0)
{
CheckBoxList1.DataSource = dt;
CheckBoxList1.DataTextField = "subDepatment"; // the items to be displayed in the list items
CheckBoxList1.DataValueField = "Id"; // the id of the items displayed
CheckBoxList1.DataBind();
}
}
catch (System.Data.SqlClient.SqlException ex)
{
}
finally
{
con.Close();
}
}
您需要維護主集合(將保存下拉列表值)和一個集合(將保存選定值)。 通過將過濾器用作主集合(選定集合)來綁定下拉列表。 而且,僅當下拉值更改時,才需要添加或刪除所選集合。
因此,將示例視為-
MasterList集合-財務,市場,促銷選定的集合-空
現在,為每個下拉列表應用過濾器“主列表-已選擇並綁定”。
因此,對於所有Dropdown價值營銷,財務,促銷。 您選擇“市場營銷”作為第一個下拉菜單,然后選擇“第二個下拉菜單”值,除非= Masterlist-Selected = Finance and Promition。
而且,如果僅通過查詢DB綁定下拉列表,那么它將很簡單。
//我嘗試過了
<script type="text/javascript">
function funcCheck(obj)
{
var isSelected=false;
var selectedVal=$(obj).val();
var ctrlId=$(obj).attr("id");
alert(selectedVal);
alert($("[id*=ddlist]").length);
$("[id*=ddlist]").each(function(){
if($.trim($(this).attr("id"))!=$.trim(ctrlId))
{
if(selectedVal == $(this).val())
{
isSelected=true;
return;
}
}
});
if(isSelected)
{
alert("Value is already selected");
$(obj).val(0);
return false;
}
}
</script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.