ASP.net versteckt panel mit javascript

Ich habe eine radioButtonList mit 2 Positionen. Ein radiobutton mit "ja" - Wert und ein radionButton mit einem "Nein" Wert.

Unten, ich habe ein panel, das will ich sichtbar gemacht, wenn "ja" radioButton ausgewählt ist, und ausgeblendet, wenn "Keine" ausgewählt ist. Ich hatte ursprünglich eingeführt, dies mit Hilfe des AutoPostBack-Attribut, aber ich möchte es in Javascript, so dass es nicht zu einem postback. Hier ist der code. Jegliche Hilfe würde sehr geschätzt werden.

<asp:RadioButtonList ID="rbl1" runat="server" onClick="changed(this);" >
<asp:ListItem Value="Yes">Yes</asp:ListItem>
<asp:ListItem Value="No">No</asp:ListItem>

<asp:Panel ID="panel1" runat="server">
<--other controls here -->
</asp:Panel>

function changed(rbl) {
        //not sure what to put in here
    }

Vielen Dank im Voraus,

Zappt

InformationsquelleAutor Riain McAtamney | 2010-03-12

  1. 3

    Hier ist ein kurzes Beispiel von mir:

    <!-- Used grouped radio buttons instead of the RadioButtonList as it is harder to deal with -->
<asp:RadioButton ID="rbYes" runat="server" Text="Yes" GroupName="YourGroupName" Checked="true" />
<asp:RadioButton ID="rbNo" runat="server" Text="No" GroupName="YourGroupName" />        
<br /><br />    
<!-- Use a div instead of a panel.  Panels are just glorified divs. -->
<div id="divTest">
    This is a test
</div>

<script type="text/javascript">
    $(document).ready(function()
    {
        $('#<%= rbYes.ClientID %>').click(function() { $('#divTest').show(); });
        $('#<%= rbNo.ClientID %>').click(function() { $('#divTest').hide(); });

    });
</script>

    InformationsquelleAutor Kelsey

  2. 1

        function OnclickPanelHide() {
        if (this.value == "No") {
            document.getElementByID('<%=panel1.ClientID%>').style.display = "none";
        }
        else {
            document.getElementByID('<%=panel1.ClientID%>').style.display = "block";
        }
    }


</script>

    Raja Es gibt einige Fehler in Ihrem code, den ich gerade entfernt es

    Dies sollte ein Kommentar ein oder Bearbeiten Sie auf der Raja Antwort. Bitte Lesen Sie diese: stackoverflow.com/help

    InformationsquelleAutor Saineshwar

  3. 0

    Wenn Sie eine Klasse hinzufügen, oder bestimmen Sie die real-id von "panel1", können Sie mit jQuery ausblenden, es ganz einfach:

    $('idOfPanel').hide();

    Oder Sie ohne die Verwendung von jQuery, mit der id des div/panel:

    idOfPanel.style.display = "none";

    Wieder:

    $('idOfPanel').show();

    Oder 

    idOfPanel.style.display = "block";

    InformationsquelleAutor Lance Harper

  4. 0

    versuchen Sie dies:

    if (this.value == "No")
{
document.getElementByID('<%=panel1.ClientId%').style.display = "none";
}
else
{
document.getElementByID('<%=panel1.ClientId%').style.display = "block";
}

    Hoffe, es hilft.

    InformationsquelleAutor Raja

  5. 0

    wenn dir nichts ausmacht eine partielle postback, Sie können auch werfen Sie Ihren code in eine UpdatePanel (vorausgesetzt, dass Sie nicht wollen, um ein postback, so dass die gesamte Seite nicht müssen gehen durch eine Seite des Lebens-Zyklus).

    InformationsquelleAutor Jason M

Schreibe einen Kommentar