jquery动态地通过名称获取radiobuttonlist

时间:2010-06-11 14:00:01

标签: jquery

我在页面上有两个radiobuttonlist和一个checkboxlist。理想情况下,基于复选框选择的值,我想使用jquery函数启用/禁用相应的radibuttonlist。

但有些$(“input [name * =”+ columnName +“]”)总是返回null。它的名字找不到radiobuttonlist?

    $(function() {
        function checkBoxClicked() {

            var isChecked = $(this).is(":checked");
            var columnName = "rblColumn" + $(this).parent().attr("alt");

            if (isChecked) {
                $("input[name*=" + columnName + "]").removeAttr("disabled");
            } else {
                $("input[name*=" + columnName + "]").attr("disabled", "disabled");

                $("input[name*=" + columnName + "] input").each(function() {
                    $(this).attr("checked", "")
                });

            }

        }

        //intercept any check box click event inside the #list Div
        $(":checkbox").click(checkBoxClicked);
    });




<asp:Panel ID="TestPanel" runat="server">
<asp:CheckBoxList ID = "chkColumn" runat="server" RepeatDirection="Horizontal">
    <asp:ListItem id = "Column1" runat="server" Text="Column 1" Value="1" alt="1" class="HeadColumn" />
    <asp:ListItem id = "Column2" runat="server" Text="Column 2" Value="2" alt="2" class="HeadColumn"/>
</asp:CheckBoxList>

<table>
    <tr>
        <td>
            <asp:RadioButtonList ID = "rblColumn1" runat="server" RepeatDirection="Vertical" disabled="disabled">
                <asp:ListItem id="liColumn1p" runat="server" />
                <asp:ListItem id="liColumn1n" runat="server" />
            </asp:RadioButtonList>
        </td>
        <td>
            <asp:RadioButtonList ID = "rblColumn2" runat="server" RepeatDirection="Vertical" disabled="disabled">
                <asp:ListItem id="liColumn2p" runat="server" />
                <asp:ListItem id="liColumn2n" runat="server" />
            </asp:RadioButtonList>
        </td>
    </tr>
</table>
</asp:Panel>

源:

<div id="TestPanel">

<table id="chkColumn" border="0">
        <tr>
            <td><span id="Column1" alt="1" class="HeadColumn"><input id="chkColumn_0" type="checkbox" name="chkColumn$0" /><label for="chkColumn_0">Column 1</label></span></td><td><span id="Column2" alt="2" class="HeadColumn"><input id="chkColumn_1" type="checkbox" name="chkColumn$1" /><label for="chkColumn_1">Column 2</label></span></td>
        </tr>
    </table>

<table>
    <tr>
        <td>
            <table id="rblColumn1" class="myRadioButtonList" disabled="disabled" border="0">
        <tr>
            <td><span id="liColumn1p"><input id="rblColumn1_0" type="radio" name="rblColumn1" value="" /></span></td>
        </tr><tr>
            <td><span id="liColumn1n"><input id="rblColumn1_1" type="radio" name="rblColumn1" value="" /></span></td>
        </tr>
    </table>
        </td>
        <td>
            <table id="rblColumn2" class="myRadioButtonList" disabled="disabled" border="0">
        <tr>
            <td><span id="liColumn2p"><input id="rblColumn2_0" type="radio" name="rblColumn2" value="" /></span></td>
        </tr><tr>
            <td><span id="liColumn2n"><input id="rblColumn2_1" type="radio" name="rblColumn2" value="" /></span></td>
        </tr>
    </table>
        </td>
    </tr>
</table>

</div>

2 个答案:

答案 0 :(得分:1)

我明白了。我在每个radiobutonlist中添加了cssclass并通过id:

找到它

$(“。myRadioButtonList [id * =”+ columnName +“]”)。removeAttr(“disabled”);

现在正在运作。谢谢,帕特里克。你提醒我有关id / name滥用的信息。

答案 1 :(得分:0)

为我工作(jQuery):

$('[name*="' + columnName + '"]');