清除函数中的复选框列表

2019-12-11 03:05:46 阅读：249 来源： 互联网

标签：checkboxlist webforms asp-net c checkbox

我正在尝试在复选框切换后实施“清除所有复选框”.

<div class="form-group" id="divExecutionSchedule">
    <label class="control-label col-md-2" id="lblExecutionSchedule">Execution Schedule</label>
    <div class="col-md-3">
        <div class="input-group">
            <asp:CheckboxList ID="ddlExecutionSchedule" ClientIDMode="Static" CssClass="chkLabel" runat="server" AutoPostBack="false" CellPadding="5" CellSpacing="5" RepeatDirection="Horizontal" RepeatLayout="Table" onchange="ToggleExecutionSchedule(this)" >
                <asp:ListItem Text="Daily" Value="Daily"></asp:ListItem>
                <asp:ListItem Text="Weekly" Value="Weekly"></asp:ListItem>
            </asp:CheckboxList>
        </div>
    </div>
    <label class="control-label col-md-2"></label>
    <div class="col-md-10">
        <div class="alert alert-danger hidden" role="alert" id="executionScheduleError"></div>
    </div>
</div>

<div class="form-group" id="divSelectDay" >
    <label class="control-label col-md-2" id="lblSelectDay">Select Day of Week</label>
    <div class="col-md-3">
        <div class="input-group">
            <asp:CheckBoxList ID="chkSelectDay" CssClass="chkLabel" ClientIDMode="Static" runat="server" AutoPostBack="false" CellPadding="5" CellSpacing="5" RepeatDirection="Horizontal" RepeatLayout="Table"> 
                <asp:ListItem Value="Monday">Mon</asp:ListItem>
                <asp:ListItem Value="Tuesday">Tue</asp:ListItem>
                <asp:ListItem Value="Wednesday">Wed</asp:ListItem>
                <asp:ListItem Value="Thursday">Thu</asp:ListItem>
                <asp:ListItem Value="Friday">Fri</asp:ListItem>
                <asp:ListItem Value="Saturday">Sat</asp:ListItem>
                <asp:ListItem Value="Sunday">Sun</asp:ListItem>
            </asp:CheckBoxList>
        </div>
    </div>
    <label class="control-label col-md-2"></label>
</div>

在同一页面中,我有一个功能,每当选中/取消选中每周复选框时,就会显示/隐藏复选框列表.

它不会清除复选框列表.因此,如果再次选中,将显示先前的选择(星期一,星期二等).

function ToggleExecutionSchedule(controlId) {
    var frmControl = document.getElementById(controlId.id);
    var divDay = document.getElementById("divSelectDay");

    var checkbox = frmControl.getElementsByTagName("input");
    var counter = 0;
    for (var i = 0; i < checkbox.length; i++) {
        if (checkbox[i].checked)
        {
            if (checkbox[i].value == "Weekly")
                divDay.style.display = 'block';
        }
        else
        {
            if (checkbox[i].value == "Weekly") {
                divDay.style.display = 'none';
                //clear divDay/chkSelectDay checkboxlist <===
            }
        }
    }
}

我看到了一些有关使用CheckBoxList1.Items.Clear();的文章,但是我无法在函数中检索复选框列表chkSelectDay的值.

问：取消选中每周复选框时,如何清除复选框列表chkSelectDay？

解决方法:

使用WebForms时,您应该像使用所有框架一样接受框架,而不是与之抗争.这是典型的WebForms方法：

在您的页面上有一个ASP.NET按钮,如下所示：

<asp:Button runat="server" OnClick="ClearButtons" Text="ClearButtons"/>

然后,在服务器端清除您的复选框：

protected void ClearButtons(object sender, EventArgs e)
{
    foreach (ListItem item in chkSelectDay.Items)
    {
        item.Selected = false;
    }
}

这会导致按钮单击后发回,并随后重新加载客户端页面.为了避免可见的页面重新加载,您可以将相关的div放入UpdatePanel中,如下所示：

<asp:UpdatePanel runat="server">
    <ContentTemplate>
        <div class="form-group" id="divSelectDay">
            <label class="control-label col-md-2" id="lblSelectDay">Select Day of Week</label>
            <div class="col-md-3">
                <div class="input-group">
                    <asp:CheckBoxList ID="chkSelectDay" CssClass="chkLabel" ClientIDMode="Static" runat="server" AutoPostBack="false" CellPadding="5" CellSpacing="5" RepeatDirection="Horizontal" RepeatLayout="Table">
                        <asp:ListItem Value="Monday" Selected="True">Mon</asp:ListItem>
                        <asp:ListItem Value="Tuesday">Tue</asp:ListItem>
                        <asp:ListItem Value="Wednesday">Wed</asp:ListItem>
                        <asp:ListItem Value="Thursday">Thu</asp:ListItem>
                        <asp:ListItem Value="Friday">Fri</asp:ListItem>
                        <asp:ListItem Value="Saturday">Sat</asp:ListItem>
                        <asp:ListItem Value="Sunday">Sun</asp:ListItem>
                    </asp:CheckBoxList>
                </div>
            </div>
            <label class="control-label col-md-2"></label>
            <asp:Button runat="server" OnClick="ClearButtons" Text="ClearButtons"/>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

标签：checkboxlist,webforms,asp-net,c,checkbox
来源： https://codeday.me/bug/20191211/2106096.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

清除函数中的复选框列表