使用 c# 在复选框列表中选择单个项目
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11687370/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
select a single item in checkbox list using c#
提问by rom fernando
I am using a checkboxlist in asp.net page and bound data from database. Now i want to select the single item. Suppose i select an item means clear the old selection and select the new items only
我在 asp.net 页面中使用复选框列表并从数据库绑定数据。现在我想选择单个项目。假设我选择一个项目意味着清除旧选择并只选择新项目
Please help me to do this..
请帮我做这个..
采纳答案by yogi
Try this
尝试这个
Front end
前端
function radioMe(e) {
if (!e) e = window.event;
var sender = e.target || e.srcElement;
if (sender.nodeName != 'INPUT') return;
var checker = sender;
var chkBox = document.getElementById('<%= chks.ClientID %>');
var chks = chkBox.getElementsByTagName('INPUT');
for (i = 0; i < chks.length; i++) {
if (chks[i] != checker)
chks[i].checked = false;
}
}
<asp:CheckBoxList runat="server" ID="chks">
<asp:ListItem>Item</asp:ListItem>
<asp:ListItem>Item</asp:ListItem>
<asp:ListItem>Item</asp:ListItem>
<asp:ListItem>Item</asp:ListItem>
</asp:CheckBoxList>
Back end
后端
protected void Page_Load(object sender, EventArgs e)
{
chks.Attributes.Add("onclick", "radioMe(event);");
}
But instead of doing all this you should consider RadioButtonListcontrol
但与其做这一切，不如考虑RadioButtonList控制
回答by Leandro Gomide
Looks like a RadioButtonListwould fit better, as it only lets you select a single element.
看起来 aRadioButtonList更合适，因为它只允许您选择单个元素。
ASP.NET RadioButtonList Control
Radio-Buttonlist Sample
单选按钮列表示例
回答by usugarbage
Using a CheckBoxList over a RadioButtonList can be handy sometimes as it allows a user to unselect a choice without me having to invent a work-around. Following yogi's answer I wanted an approach that allowed easy reuse without having to plug in a ClientID of the CheckBoxList into the function for each use. Thanks for the template yogi.
在 RadioButtonList 上使用 CheckBoxList 有时会很方便，因为它允许用户取消选择，而我不必发明解决方法。按照瑜伽士的回答，我想要一种允许轻松重用的方法，而无需在每次使用时将 CheckBoxList 的 ClientID 插入到函数中。感谢您的模板瑜伽士。
Usage:
<asp:CheckBoxList ID="m_testControl" runat="server" data-toggle="radio" RepeatDirection="Horizontal"> <asp:ListItem Value="CON">Concur</asp:ListItem> <asp:ListItem Value="CWI">Concur With Intent</asp:ListItem> <asp:ListItem Value="DNC">Do Not Concur</asp:ListItem> </asp:CheckBoxList>JQuery Function:
$(document).ready(function () { // turn all CheckBoxLists labeled for 'radio' to be single-select $('[data-toggle=radio]').each(function () { var clientId = $(this).attr('id'); $(this).find('input').each(function () { // set parent's id $(this).attr('data-parent', clientId); // add an onclick to each input $(this).click(function (e) { // ensure proper event if (!e) e = window.event; var sender = e.target || e.srcElement; if (sender.nodeName != 'INPUT') return; // toggle off siblings var id = $(this).attr('id'); var parent = $(this).attr('data-parent'); $('input[data-parent=' + parent + ']').not('#' + id).prop('checked', false); }); }); }); });
用法：
<asp:CheckBoxList ID="m_testControl" runat="server" data-toggle="radio" RepeatDirection="Horizontal"> <asp:ListItem Value="CON">Concur</asp:ListItem> <asp:ListItem Value="CWI">Concur With Intent</asp:ListItem> <asp:ListItem Value="DNC">Do Not Concur</asp:ListItem> </asp:CheckBoxList>jQuery 函数：
$(document).ready(function () { // turn all CheckBoxLists labeled for 'radio' to be single-select $('[data-toggle=radio]').each(function () { var clientId = $(this).attr('id'); $(this).find('input').each(function () { // set parent's id $(this).attr('data-parent', clientId); // add an onclick to each input $(this).click(function (e) { // ensure proper event if (!e) e = window.event; var sender = e.target || e.srcElement; if (sender.nodeName != 'INPUT') return; // toggle off siblings var id = $(this).attr('id'); var parent = $(this).attr('data-parent'); $('input[data-parent=' + parent + ']').not('#' + id).prop('checked', false); }); }); }); });
回答by Bhanu Pratap
$('input[type=checkbox]').click(function () {
var chks = document.getElementById('<%= chkBranchRoleTransaction.ClientID %>').getElementsByTagName('INPUT');
for (i = 0; i < chks.length; i++) {
chks[i].checked = false;
}
$(this)[0].checked = true;
});
// or//
$('input[type=checkbox]').click(function () {
var chkBox = document.getElementById('<%= chkBranchRoleTransaction.ClientID %>');
var chks = chkBox.getElementsByTagName('INPUT');
for (i = 0; i < chks.length; i++) {
chks[i].checked = false;
}
$(this)[0].checked = true;
});
});[enter image description here][1]
[1]: http://i.stack.imgur.com/zzaaz.jpg
回答by SAMU HORO
var id = "";
$("#CblProduct").on('click', ':checkbox', function () {
if (id != "")
{
$(id).attr('checked', false);
$(this).attr('checked', true);
}
if($("#CblProduct").length > 0)
{
id = this;
}
});
回答by Azadeen Alasd
static int indexOfL=0;// the index of initial selected item
protected void CheckBoxList1_SelectedIndexChanged(object sender, EventArgs e)
{
int i = 0;
foreach (ListItem li in CheckBoxList1.Items)
{
{
if (i != indexOfL && li.Selected)
{
indexOfL=i;
CheckBoxList1.ClearSelection();
li.Selected = true;
}
i++;
}
}}
i"m saving the index of selected item and when there is a change we get two selected items so with help of indexOfL we get the right item to keep. i don"t know if this approach is the best because this code runs in the server side.... hope it helps...
我正在保存所选项目的索引，当有变化时，我们会得到两个所选项目，因此在 indexOfL 的帮助下，我们可以保留正确的项目。我不知道这种方法是否最好，因为此代码在服务器端......希望它有帮助......
