只允许在modalpopup中的gridview中选中一个复选框

时间:2014-05-07 21:22:38

标签: c# asp.net gridview checkbox modalpopup

我有一个具有gridview的模态弹出窗口,这个gridview有很多行,我只希望用户能够选择一行。因此,如果他们选择另一个,它将取消选择前一个。

我尝试了很多方法,但无法触发oncheckedchanged事件。 请有人帮忙 干杯

<asp:button id="btnShowPopupOW" style="display: none" runat="server" />
<asp:modalpopupextender id="mpeOW" behaviorid="mpeOW" runat="server" targetcontrolid="btnShowPopupOW"
    popupcontrolid="pnlpopupOW" cancelcontrolid="imgOWCancel" backgroundcssclass="modalBackground" />
<asp:panel id="pnlpopupOW" runat="server" width="600px" style="display: none;" class="ModalPanel">

            <div style="position: relative; min-height: 490px;">
                <asp:UpdatePanel ID="upExisting" runat="server" ChildrenAsTriggers="true">
                    <ContentTemplate>
                        <table style="width: 600px;">
                            <tr height="25px">
                                <td>
                                    <asp:Panel ID="pnlPrev" runat="server" Height="200px" ScrollBars="Auto" HorizontalAlign="Center">
                                        <asp:GridView ID="grdPrevious" runat="server" ClientIDMode="Static" AutoGenerateColumns="false" Width="100%"
                                            ShowFooter="false" ShowHeaderWhenEmpty="false" DataKeyNames="ID"  >
                                            <Columns>
                                                <asp:BoundField DataField="dates" HeaderText="Dates" />
                                                <asp:BoundField DataField="Prev" HeaderText="Previous" />
                                                <asp:TemplateField>
                                                    <ItemTemplate>
                                                        <asp:CheckBox ID="ChkSelect" runat="server"  OnCheckedChanged="ChkSelect_OnCheckedChanged" />
                                                    </ItemTemplate>
                                                </asp:TemplateField>
                                            </Columns>
                                        </asp:GridView>
                                    </asp:Panel>
                                </td>
                            </tr>
                        </table>
                    </ContentTemplate>
                    <Triggers>

                    </Triggers>
                </asp:UpdatePanel>
                </div>
                </asp:panel>

以下代码隐藏

protected void ChkSelect_OnCheckedChanged(object sender, EventArgs e)
        {
            CheckBox activeCheckBox = sender as CheckBox;

            foreach (GridViewRow rw in grdPrevious.Rows)
            {
                CheckBox chkBx = (CheckBox)rw.FindControl("ChkSelect");
                if (chkBx != activeCheckBox)
                {
                    chkBx.Checked = false;
                }
                else
                {
                    chkBx.Checked = true;
                }
            }
        }

3 个答案:

答案 0 :(得分:3)

你可以这样做。使用jquery ....选择单个复选框。

<ItemTemplate>
  <asp:CheckBox ID="ChkSelect" runat="server"  onclick="CheckOne(this)" />
</ItemTemplate>
function CheckOne(obj) {
    var grid = obj.parentNode.parentNode.parentNode;
    var inputs = grid.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        if (inputs[i].type == "checkbox") {
            if (obj.checked && inputs[i] != obj && inputs[i].checked) {
                inputs[i].checked = false;
            }
        }
    }
}  

答案 1 :(得分:0)

你需要的可能是(RadioButton)[http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.radiobutton(v=vs.110).aspx]而不是CheckBox。

您可以将RadioButton组合在一起,然后允许用户只选择一个项目并自动取消选择之前选择的项目 - 或者:完全符合您的应用程序所需的行为。

此示例代码取自链接的MSDN文档。请注意GroupName属性

<%@ Page Language="C#" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>RadioButton Example</title>
    <script language="C#" runat="server">

     void SubmitBtn_Click(Object Sender, EventArgs e) {

         if (Radio1.Checked) {
             Label1.Text = "You selected " + Radio1.Text;
         }
         else if (Radio2.Checked) {
             Label1.Text = "You selected " + Radio2.Text;
         }
         else if (Radio3.Checked) {
             Label1.Text = "You selected " + Radio3.Text;
         }
     }

     </script>

</head>
<body>

 <h3>RadioButton Example</h3>
 <form id="form1" runat="server">
     <h4>Select the type of installation you want to perform:</h4>
     <asp:RadioButton id="Radio1" Text="Typical" Checked="True" GroupName="RadioGroup1" runat="server" />
     <br />
     This option installs the features most typically used.  <i>Requires 1.2 MB disk space.</i><br />
     <asp:RadioButton id="Radio2" Text="Compact" GroupName="RadioGroup1" runat="server"/>
     <br />
     This option installs the minimum files required to run the product.  <i>Requires 350 KB disk space.</i>
     <br />
     <asp:RadioButton id="Radio3" runat="server" Text="Full" GroupName="RadioGroup1" />
     <br />
     This option installs all features for the product.  <i>Requires 4.3 MB disk space.</i>
     <br />
     <asp:button text="Submit" OnClick="SubmitBtn_Click" runat="server"/>
     <asp:Label id="Label1" font-bold="true" runat="server" />
 </form>

 

答案 2 :(得分:0)

您要选中一个复选框。我认为使用此功能,您一次只能选择一个复选框。将以下Java脚本代码放在网页的顶部

<script type="text/javascript">  

function SingleCheckboxCheck(ob)
{
   var gridvalue = ob.parentNode.parentNode.parentNode;
   var inputs = gridvalue.getElementsByTagName("input");

    for(var i=0;i<inputs.length;i++)
     {
      if (inputs[i].type =="checkbox")
       {
         if(ob.checked && inputs[i] != ob && inputs[i].checked)
            {
                inputs[i].checked = false;
            }
        }
     }
}
</script>

在此将复选框作为GridView的TemplateField放在其中,只需调用上述javascript函数即可使其成为可检查的。

 onclick ="SingleCheckboxCheck(this)"