asp.net多用戶控制客戶端ID問題

Question

我有一個用戶控件，可將ID和值列表加載到復選框列表中，並在提交后將它們保存到數據庫中。 我的問題是，我在同一頁面上多次使用該控件，因此當我將每個列表提交並保存到數據庫時，在保存每個列表時僅從其中一個控件就可以看到相同的數據。 我已經對此問題進行了一些研究，但我不了解如何在我的控件中實施任何解決方案。

這是我的代碼背后。 我有處理該復選框並顯示該列表的javascript，所有這些似乎都可以正常運行。 如果有人能指出我正確的方向，將不勝感激。

public partial class DropDownCheckBoxList : System.Web.UI.UserControl
{

/// <summary>
/// Value to set to the label describing the listbox
/// </summary>
public string ListName
{
    get
    {
        return (string)ViewState["listname"];
    }
    set
    {
        ViewState["listname"] = value;
    }
}

/// <summary>
/// Page load events
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        this.lblListName.Text = ListName;
    }
}

/// <summary>
/// Build the checkboxlist
/// </summary>
/// <param name="dtListItem">Data for all items in the list</param>
public void BuildCheckList(DataTable dtListItem)
{
    //ddlChkList.Items.Insert(0, new ListItem());
    int rowNo = dtListItem.Rows.Count;
    string lstValue = string.Empty;
    string lstID = string.Empty;
    ListItem lstItem = new ListItem();
    for (int i = 0; i < rowNo; i++)
    {
        lstValue = dtListItem.Rows[i]["Value"].ToString();
        lstID = dtListItem.Rows[i]["ID"].ToString();
        lstItem = new ListItem("<span class=\"ddcblitem\"><a href=\"javascript:void(0)\" id=\"alst\" style=\"text-decoration:none;color:Black; \" onclick=\"getSelectedItem(' " + lstValue + "','" + i + "','" + lstID + "','anchor');\">" + lstValue + "</a></span>", lstID);
        lstItem.Attributes.Add("onclick", "getSelectedItem('" + lstValue + "','" + i + "','" + lstID + "','listItem');");
        this.chkLstItem.Items.Add(lstItem);
    }
    this.divChkList.Style.Add("border", "black 1px solid");
    this.divChkList.Style.Add("width", "155px");
    this.divChkList.Style.Add("height", "auto");
    this.divChkList.Style.Add("overflow", "AUTO");
    this.divChkList.Style.Add("display", "none");
}

/// <summary>
/// Set the checkboxes in the list
/// </summary>
/// <param name="list">ID's of checked items</param>
public void setMultiList(List<int> list)
{
    foreach (ListItem li in this.chkLstItem.Items)
        foreach (int selected in list)
            if (li.Value == selected.ToString())
                li.Selected = true;
}

/// <summary>
/// Return values of checked boxes
/// </summary>
/// <returns>Checked ID values</returns>
public List<int> build_id_list()
{
    List<int> lstIds = new List<int>();
    foreach (ListItem li in this.chkLstItem.Items)
        if (li.Selected)
            lstIds.Add(Convert.ToInt32(li.Value));
    return lstIds;
}
}

另外，我有一個標簽，用於顯示在代碼背后的javascript中更改了哪些值。 除了我在頁面上放置的第一個用戶控件以外，沒有顯示標簽。 我假設這是因為它們從用戶控件共享相同的ID。

這是我的ascx標記：

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="DropDownCheckBoxList.ascx.cs" Inherits="DropDownCheckBoxList" %>

<table>
    <tr>
    <td>
        <asp:Label ID="lblListName" Text="List Name" CssClass="wideLabel" runat="server" />
    </td>
    <td>
        <table class="ddcbl" border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td>
                    <asp:Label ID="lblChkList" Text="Click to Select..." BorderWidth="1px" BorderStyle="Solid" BackColor="White" onmousedown="showdivonClick(this)" Width="155px" runat="server" />
                    <%--<asp:DropDownList ID="ddlChkList" runat="server" onmousedown="showdivonClick()" Width="155">
                    </asp:DropDownList>--%>
                    <div id="divChkList" class="divchkList" runat="server">
                        <asp:CheckBoxList ID="chkLstItem" runat="server" onmousedown="showdiv(this)">
                        </asp:CheckBoxList>
                    </div>
                </td>
            </tr>
        </table>
        <asp:HiddenField ID="hidList" runat="server" />
    </td>
    </tr>
</table>
<asp:Label ID="lblSelectedItem" runat="server"></asp:Label>

<script language="javascript" type="text/javascript">
    function showdiv(obj) {
    obj.style.display = "block";
    }
    function showdivonClick(obj) {
    var objDLL = obj.parentNode.getElementsByClassName('divchkList')[0];
    if (objDLL.style.display == "block")
        objDLL.style.display = "none";
    else
        objDLL.style.display = "block";
    }
    function getSelectedItem(lstValue, lstNo, lstID, ctrlType) {
    var arr = document.getElementById('<%=chkLstItem.ClientID %>').getElementsByTagName('input');
    var objLstId = document.getElementById('<%=hidList.ClientID %>');
    for (i = 0; i < arr.length; i++) {
        checkbox = arr[i];
        if (i == lstNo)
            if (ctrlType == 'anchor')
                if (!checkbox.checked)
                    checkbox.checked = true;
                else
                    checkbox.checked = false;
    }
    setSelected();
    }

    document.onclick = check;
    function check(e) {
    var target = (e && e.target) || (event && event.srcElement);
    var obj = document.getElementById('<%=divChkList.ClientID %>');
    var obj1 = document.getElementById('<%=lblChkList.ClientID %>');
    if (obj == null) { return; }
    if (target.id != "alst" && !target.id.match('<%=chkLstItem.ClientID %>')) {
        if (!(target == obj || target == obj1)) {
            obj.style.display = 'none'
        }
        else if (target == obj || target == obj1) {
            if (obj.style.display == 'block') {
                obj.style.display = 'block';
            }
            else {
                obj.style.display = 'none';
                document.getElementById('<%=lblChkList.ClientID %>').blur();
            }
        }
    }
    }

    $('<%=hidList %>').ready(function () {
    setSelected();
    });

    function setSelected() {
    var lblSelected = document.getElementById('<%=lblSelectedItem.ClientID %>');
    var ddl = document.getElementById('<%=lblChkList.ClientID %>');
    var count = 0;
    var selected_text = 'none';
    if (document.getElementById('<%=chkLstItem.ClientID %>') != null) {
        var items = document.getElementById('<%=chkLstItem.ClientID %>').getElementsByTagName('input');
        var labels = document.getElementById('<%=chkLstItem.ClientID %>').getElementsByTagName('label');
        for (var i = 0; i < items.length; i++) {
            if (items[i].checked) {
                count = count + 1;
                if (count == 1)
                    selected_text = labels[i].innerText;
                else if (count < 4)
                    selected_text = selected_text + ', ' + labels[i].innerText;
            }
        }
        if (count >= 4)
            selected_text = selected_text + ', ...';
        lblSelected.innerText = 'Selected: ' + selected_text;
        if (count == 0)
            ddl.innerText = ' Click to Select...';
        else
            ddl.innerText = '  ' + count + ' selected';
        //ddl.options[ddl.selectedIndex].text = count + ' selected';
        document.getElementById('<%=hidList.ClientID %>').value = count + ' Items';
    }
    }
</script>

Answer 1

解決了我的問題。

問題不在於用戶控件，而在於用戶控件的使用。 我和我的同事未能使用適當的對象。

我們有3個控件，ddcbl ddcbl1 ddcbl2。

我們沒有設置每個列表，而是設置了ddcbl 3次，因此顯然失敗了。

干杯