Javascript 删除其他下拉列表中的选定项

我有两个内容相同的

DropDownList

s（即财务、营销、促销）。我想从列表的其余部分删除已选择的值

示例：如果我为第一个列表选择“财务”，则应将其从其他列表中删除；第二个列表应仅显示“营销”和“促销”

但是，当在第一个列表中选择任何值时，当前代码仍显示其他列表中的所有值

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>

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();
    }
}

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();
    }
}

在选择的索引更改时

<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>

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();
    }
}

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();
    }
}

---

您需要维护将保存下拉列表值的主集合和一个将保存选定值的集合。通过应用过滤器作为主集合-选定集合绑定下拉列表。并且，只有当下拉列表值更改时，才需要从所选集合中添加或删除

请举例说明-< /P> 主列表集合-财务、营销、促销 所选集合-空

现在，为每个下拉列表应用过滤器主列表-选中并绑定

因此，对于所有下拉式价值观，营销、财务、促销。 第一个下拉列表选择营销，第二个下拉列表选择可用值ill be=Masterlist-Selected=Finance and promistion

---

如果您仅通过查询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>

功能检查（obj）
{
var isSelected=假；
var selectedVal=$（obj.val（）；
var ctrlId=$（对象）.attr（“id”）；
警报（selectedVal）；
警报（$（“[id*=ddlist]”。长度）；
$（“[id*=ddlist]”。每个（函数（）{
如果（$.trim（$（this.attr（“id”））！=$.trim（ctrlId））
{
if（selectedVal==$（this.val（））
{
isSelected=true；
返回；
}
}
});
如果（当选）
{
警报（“已选择值”）；
$（obj）.val（0）；
返回false；
}
}