0
我有一個用戶控件，將ID和值的列表加載到複選框列表中，並在提交時將它們保存到數據庫。我的問題是，我在同一頁面上多次使用控件，因此當我將每個列表提交併保存到數據庫時，我在保存每個列表時都看到與其中一個控件相同的數據。我已經對這個問題做了一些研究，但我不瞭解如何在我的控制中實施任何解決方案。asp.net多用戶控制客戶端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>
請張貼您的標記。 'runat =「server」'標記可確保頁面上的每個控件都有自己獨特的ID，所以我認爲這不是問題所在。 – PoweredByOrange 2014-11-05 18:30:21
我更新了用戶控件標記，它的JavaScript，我最好喜歡渲染一次，但JavaScript是不是我現在最強的西裝。 – schaefec 2014-11-05 18:35:20