Question

在我的表单中，我使用的是AjaxToolkit ModalPopupExtender。 PopupControlId已被设置为一个具有RadioButtonList和下拉列表的面板。弹出的面板是这样的：

            <asp:Panel ID="PopUpWindowPanel" runat="server" Visible="false" BorderStyle="Solid">
                <table cellpadding="2" cellspacing="0" width="100%" border="0" class="dataTbl">
                    <tr>
                        <td class="left">
                            <asp:RadioButtonList ID="RdBtnLstSortOptions" runat="server">
                                <asp:ListItem Text="No change." Selected="True"
                                    Value="None"></asp:ListItem>
                                <asp:ListItem Text="Some Change."
                                    Value="Existing"></asp:ListItem>
                            </asp:RadioButtonList>
                        </td>
                    </tr>
                    <tr>
                        <td class="left">
                            <asp:Label ID="lblList" runat="server">List:</asp:Label>&nbsp;
                            <asp:DropDownList ID="ddlList" runat="server" Visible="false">
                            </asp:DropDownList>
                        </td>
                    </tr>

                    <tr>
                        <td colspan="3">
                            <div class="divBtn">
                                <asp:LinkButton ID="btnDone" class="button" runat="server" OnClick="btnDone_Click">OK</asp:LinkButton>&nbsp;
                                <asp:LinkButton ID="btnCloseProfile" class="button" runat="server">Cancel</asp:LinkButton>
                            </div>
                        </td>
                    </tr>
                </table>
            </asp:Panel>

现在，我想要的是当用户选择带有Text =“Some Change”的Listitem时。和Value =“Existing”，然后才会显示id =“ddlList”的dropdownlist，否则必须隐藏它。我在页面加载时在服务器端填充此列表。因为这是ajaxcontrol我不想要任何回发，因此我试图用javascript / jquery来处理这个问题。我是Javascript / Jquery的初学者，所以不知道如何正确地做到这一点。我写了一些类似的JQuery：

function pageLoad（） {

    $find('<%= RdBtnLstPresortOptions.ClientID %>').add_selectedIndexChanged(
    function (sender, args) {
        var selectedValue = $(this).val();

        if ($.trim(selectedValue) == 'Existing') {

            // show the dropdown list ddlList
        }

        else { //show the hide the dropdown list ddlList }

    });
}

我的问题是如何正确编写此jquery / javascript，以便我可以在所选的单选按钮选项上显示下拉列表。感谢。

Answer 1

这对我有用。

$("#<%=RdBtnLstPresortOptions.ClientID%>").change(function () {
    var rbvalue = $("input[@name=<%=RdBtnLstPresortOptions.UniqueID%>]:radio:checked").val();

    if (rbvalue == "Existing") {
        $("#<%=ddlList.ClientID%>").css("display", "block");
        $("#<%=lblList.ClientID%>").css("display", "block");



    } else if (rbvalue == "None") {
        $("#<%=ddlList.ClientID%>").css("display", "none");
        $("#<%=lblList.ClientID%>").css("display", "none");

    } else {

    }
});

Answer 2

当您使用Visible=False进行服务器控制时，它根本不会在客户端上呈现，因此您无法显示它。您可以做的是使用Visible=true和style="display:none"进行渲染。然后使用：

$find('').add_selectedIndexChanged(
    function (sender, args) {
        var selectedValue = $(this).val();

        if ($.trim(selectedValue) == 'Existing') {
             $get('<%= ddlList.ClientID %>').style.display="block";
            // show the dropdown list ddlList
        }

        else { //show the hide the dropdown list ddlList }

    });

处理ajaxToolkit ModalPopupExtender中的RadioButtonList SelectedIndexChanged事件而不回发

2 个答案: