動態gridview的Java驗證具有復選框

Question

我創建了一個動態的GridView。 此動態gridview具有兩個“模板字段”列。 這兩列的每一行都有復選框。 我怎樣寫的客戶端驗證，以便只有一個復選框是在特定行在給定時間檢查。

我試圖用這個代碼，但沒有奏效

  function MutExcCheckBox()
  { 
    var wipChk = document.getElementById("ckhBoxSelect");
    var aukChk = document.getElementById("chkBoxABC");
    for(i = 0; i<wipChk.length ; i++)
    {
        if(wipChk[0].checked==true)
        {
          aukChk[0].checked=false;

        }else if (aukChk[0].checked==true)
        {
            wipChk[0].checked=false;
        }
    }

我從后面的代碼中添加了Onclick屬性。

ckh.Attributes.Add("Onclick", "MutExcCheckBox()");

謝謝

Answer 1

首先，轉到jQuery網站並下載最新版本的jQuery。 將此包含在您的頁面中。

編輯：-非常抱歉，第一個解決方案對您不起作用。 實際上，當渲染GridView及其包含的控件時，它們被包裝在一邊不知道是什么:)這是aspx代碼：

<asp:GridView ID="gvTest" runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:TemplateField HeaderText="Checkbox 1">
            <ItemTemplate>
                <asp:CheckBox ID="chkFrist" CssClass="chk1" runat="server" 
                          Text='<%# Eval("Chk1") %>' />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Checkbox 2">
            <ItemTemplate>
                <asp:CheckBox ID="chkSecond" CssClass="chk2" runat="server" 
                         Text='<%# Eval("Chk2") %>' />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

JS（jQuery），您可以在body標簽之前或head內部添加此內容。 我更喜歡在封閉體標簽上方添加腳本，並在head標簽內包含外部腳本。

<script src="jquery-1.3.2.js" type="text/javascript"></script>
<script src="jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
    $(".chk1 :checkbox, .chk2 :checkbox").click(function() {
            checkGrid(this);
        });
    });

    function checkGrid(elem) {
        var chkd = $(elem).attr("checked");
        //WHEN YOU SPECIFY CSSCLASS ON CHECKBOX IT IS WRAPPED 
        //INSIDE A SPAN ELEMENT WITH GIVEN CLASS
        var cls = $(elem).parent().attr("class");

        if (chkd) {
            if (cls == "chk1")
                $(elem).parents("tr").find(".chk2  :checkbox")
                           .attr('checked', !chkd);
            else
                $(elem).parents("tr").find(".chk1 :checkbox")
                           .attr('checked', !chkd);
        }
    }
</script>