Question

我的转发器位于用户控件中并使用asp：repeater。这是我的代码：

 <asp:Repeater ID="rptrNotOnFile" Runat="server">
        <ItemTemplate>      
            <tr>
               <td>&nbsp;</td>
               <td>Item <asp:Label ID="NotOnFileItemNumber" Runat="server" />:
                   <asp:Label ID="lblPartNumberNotOnFile" Runat="server" />
               </td>
               <td>
                  <asp:Checkbox id="chkPartSelected" runat="server" onClick="isSamChecked()"/>
               </td>
               <td>
                   <asp:Checkbox id="chkPartWatchParts" runat="server"/>
               </td>               
               <td>
                   <asp:Checkbox id="samSelected" runat="server" onClick="isMbChecked()"/>
                                   </td>               
            </tr>   
        </ItemTemplate>        
    </asp:Repeater>

chkPartSelected和samSelected复选框位于每个转发器项目中，我试图在检查另一个时取消选中一个，反之亦然。

这是我的jquery函数：

<script>
 function isMbChecked() {


         if ($('#ResultsNotOnFile_rptrNotOnFile_ctl01_chkPartSelected').is(":checked"))

             ($('#ResultsNotOnFile_rptrNotOnFile_ctl01_chkPartSelected').prop("checked", false))


     }
     function isSamChecked() {

               if ($('#ResultsNotOnFile_rptrNotOnFile_ctl01_samSelected').is(":checked"))

                   ($('#ResultsNotOnFile_rptrNotOnFile_ctl01_samSelected').prop("checked", false))

     }
</script>

当我对转发器中每个复选框的唯一ID进行硬编码时，这些功能起作用，但我不希望它硬编码，因为我可以有一个或多个转发器项。

如何获取该唯一ID并将其传递给函数？

感谢您的帮助

JGraham

Answer 1

如果我是你，我会抛弃ID，因为它们并不是唯一的，并为这些ID添加了一些类，以使它们更容易被识别。

e.g。

<asp:Checkbox runat="server" class="sam" onClick="isSamChecked()"/>
<asp:Checkbox runat="server" class="mb" onClick="isMbChecked()"/>

然后你可以做类似

的事情

<script>
 function isMbChecked() {
   var closest = $(this).parent('td').siblings().children('.sam');
   closest.prop('checked', !closest.prop('checked'));
 }

 function isSamChecked() {
   var closest = $(this).parent('td').siblings().children('.mb');
   closest.prop('checked', !closest.prop('checked'));
 }
</script>

Answer 2

如果您使用的是jQuery，则可以使用jQuery选择器替换onclick函数，如下所示。首先取消选中所有复选框，然后仅在jQuery单击功能中选中使用此复选框（指向单击的复选框元素）关键字。如果转发器具有唯一ID，则可以使用选择器下方。

$('#rptrNotOnFile Checkbox[id="chkPartSelected"]').click (function() {

    $('checkbox').attr('checked',false);

    this.attr('checked',true);

})

Answer 3

以下是如何获取ID的2个示例。第一个是纯粹的javascript。第二个片段使用jQuery，需要在.aspx页面上进行一些修改。

<script type="text/javascript">
    function isChecked(element) {
        //set the checkbox names as fixed variables
        var checkbox1_name = "chkPartSelected";
        var checkbox2_name = "samSelected";

        //new variables for the id's to be found
        var checkbox1_id = "";
        var checkbox2_id = "";

        //split the id of element
        //looks something like this: mainContentPane_rptrNotOnFile_chkPartWatchParts_0
        var idArray = element.id.split('_');

        //loop all the items in the array to build the id's
        for (var i = 0; i < (idArray.length - 2) ; i++) {
            checkbox1_id += idArray[i] + "_";
            checkbox2_id += idArray[i] + "_";
        }

        //add the checkbox names and the last item of the array
        checkbox1_id += checkbox1_name + "_" + idArray[idArray.length - 1];
        checkbox2_id += checkbox2_name + "_" + idArray[idArray.length - 1];

        //set both checkboxed to unchecked
        document.getElementById(checkbox1_id).checked = false;
        document.getElementById(checkbox2_id).checked = false;

        //check the checkbox that was clicked
        element.checked = true;
    }
</script>

要使用第一个示例，只需将onClick="isSamChecked()"更改为onClick="isChecked(this)"

即可

在第二个例子中，我们将使用转发器的行号来查找复选框的ID。

首先在转发器<table id="rptrNotOnFile_table">周围的表中添加ID，因为Repeater不会将其ID添加到我们必须手动添加的页面。然后行号作为模板<tr rownumber="<%# Container.ItemIndex %>">中TR的属性。复选框本身<asp:CheckBox ID="chkPartSelected" runat="server" />上没有任何事件。

最后是剧本：

<script type="text/javascript">
    $(document).ready(function () {
        //bind a click function to the checkboxes in the table
        $("#rptrNotOnFile_table input[type='checkbox']").click(function () {
            //find the row number from the attribute of the above tr
            var rowNumber = $(this).closest('tr').attr("rowNumber");

            //the function bound to the click on the checkboxes
            isChecked(rowNumber)

            //check the checkbox that was clicked
            this.checked = true;
        })
    });

    function isChecked(rowNumber) {
        //set the id of the repeater as fixed variable
        var repeater_id = "<%= rptrNotOnFile.ClientID %>";

        //set the checkbox names as fixed variables
        var checkbox1_name = "chkPartSelected";
        var checkbox2_name = "samSelected";

        //new variables for the id's to be found
        var checkbox1_id = repeater_id + "_" + checkbox1_name + "_" + rowNumber;
        var checkbox2_id = repeater_id + "_" + checkbox2_name + "_" + rowNumber;

        //set both checkboxed to unchecked
        document.getElementById(checkbox1_id).checked = false;
        document.getElementById(checkbox2_id).checked = false;
    }
</script>

你可能会做得更简单，就像其他2个答案所示。但是，由于问题是从一个重复数据（ListView，GridView，Repeater等）的asp.net元素中获取ID，我提供了相当广泛的答案。

如何获取转发器中复选框的唯一ID？

3 个答案: