0

我有一个带有表格的 ASP.NET Web 表单。在表格内，我有一个单选按钮列表控件，在其下方有一个面板。面板内有几个带有其他 Web 控件的标签。

我想要做的是根据单选按钮列表中的选择显示或隐藏面板。在我的 jQuery 中，我有这个：

$(document).ready(function() {    
    $('#<%= rblCarrier.ClientID%>').find('input:radio').click(function() {
        var selVal = $('#<%= rblCarrier.ClientID %>').find('input:checked').val();
        if (selVal == "1") $("#mydiv").show("fast");                
        else  $("#mydiv").hide("fast");            
    })
});

如果我用显示器替换$("#mydiv").show("fast");，alert那么alert我知道到目前为止一切正常。

请记住，我的 asp.net 面板位于 HTML 表格中。

如果单选按钮值为“1”，我想要做的就是显示面板的内容，否则隐藏它。

4

2 回答 2

0

我放弃了这个。任何论坛上的任何人都没有实际使用 .NET 面板或占位符的代码。所以我选择了一条更简单的路线。我删除了面板，而是在表格行内嵌入了一个表格。我给了表格一个 ID，然后很容易用 jQuery 显示/隐藏它。显然 .NET 服务器控件不能很好地与 jQuery 搭配使用。

于 2013-01-23T12:36:13.967 回答
0

伙计们，我也在努力解决这个问题（使用 jQuery 隐藏/显示面板，但在我的情况下是使用 RadioButtonList 并且不在表格内）并搜索了很多帖子，但没有找到答案，但我能够让它工作，这就是我的方式做过...

我的代码如下：

<div>
            <p class="space">3.2. ACCOMMODATION (*)</p>

            <asp:RadioButtonList ID="accomodation" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" Width="500px">
                <asp:ListItem Text="Not Required" Value="Not Required"></asp:ListItem>
                <asp:ListItem Text="Required" Value="Required"></asp:ListItem>
            </asp:RadioButtonList>

            <asp:Panel ID="PanelAccommodation" runat="server">
                <p>
                    Number of nights (*):
                     <asp:RequiredFieldValidator ID="RequiredFieldValidator12" runat="server" ControlToValidate="numberOfNights" ForeColor="red" ErrorMessage="<- Required"></asp:RequiredFieldValidator>
                </p>
                <asp:TextBox ID="numberOfNights" runat="server" Width="50px"></asp:TextBox>

                <ajaxToolkit:FilteredTextBoxExtender ID="FilteredTextBoxExtender1" TargetControlID="numberOfNights"
                    FilterType="Numbers" runat="server">
                </ajaxToolkit:FilteredTextBoxExtender>

                <p>Preferred Hotel:</p>
                <asp:TextBox ID="preferredHotel" runat="server" Width="450px"></asp:TextBox>

                <p>Preferred Hotel URL:</p>
                <asp:TextBox ID="preferredHotelURL" runat="server" Width="450px"></asp:TextBox>
            </asp:Panel>
        </div>

和我使用的 jquery 函数：

$(document).ready(function () {
            $("#MainContent_PanelAccommodation").hide("fast");
            $('#<%= accomodation.ClientID%>').find('input:radio').click(function () {
                var selVal = $('#<%= accomodation.ClientID %>').find('input:checked').val();
                if (selVal == "Required") {
                    $("#MainContent_PanelAccommodation").show("fast");
                }
                if (selVal == "Not Required") {
                    $("#MainContent_PanelAccommodation").hide("fast");
                }
            })
        });

请注意，jquery 上的 ID 具有“MainContent”，而 HTML 上的 ID 没有，这是因为如果您检查代码并查找面板，它也可能显示和类似于 MainContent_PanelAccommodation 的 ID，因为它继承自：

<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">

希望这可以帮助人们在同样的问题上挣扎......

于 2015-01-26T10:50:51.250 回答