CODEWITHSUNDEEP
asp.net
Chinchu Sara
Chinchu Sara

Reputation: 75

how to set panel visible without postback?

In ASP.NET with C# how to set the panel visible without postback?
I have in a page three panels that are switched by clicking on 3 link buttons. When you click one button then one panel is set to visible and the other to not visible. I need to display only the selected link's panel at that time.

Is it possible to set this visibility of the panel in java script without making a post back?

This is my aspx code:

 <asp:Panel ID="panelTxtImage" runat="server" 

    style="z-index: 1; left: 438px; top: 116px; position: absolute; height: 218px; width: 521px">
    <asp:Panel ID="PanelDropQuest" runat="server" 

        <asp:Label ID="LabelQuestGroup" runat="server" 
            style="z-index: 1; left: 15px; top: 13px; position: absolute; height: 24px; width: 131px;" 
            Text="Question Group" Font-Bold="True"></asp:Label>
        <asp:CheckBox ID="CheckBoxImage" runat="server" 
            style="z-index: 1; left: 107px; top: 101px; position: absolute" />
    </asp:Panel>
    <asp:DropDownList ID="DropQuestions" runat="server" 
     style="z-index: 1; left: 173px; top: 33px; position: absolute; height: 19px; width: 274px">
        <asp:ListItem Value="-1">Select</asp:ListItem>
    </asp:DropDownList>
    <asp:Label ID="LabelQuestion" runat="server" Font-Bold="True" 
        style="z-index: 1; left: 52px; top: 89px; position: absolute; height: 28px; width: 52px" 
        Text="Question"></asp:Label>
    <asp:TextBox ID="TxtWriteQuestion" runat="server" 
        style="z-index: 1; left: 173px; top: 85px; position: absolute; height: 24px; width: 325px" 
        TextMode="MultiLine"></asp:TextBox>
    <asp:Label ID="LabelImage" runat="server" Font-Bold="True" 
        style="z-index: 1; left: 47px; top: 124px; position: absolute; height: 20px; width: 105px" 
        Text="Capture Image"></asp:Label>
    <asp:Panel ID="Panel2" runat="server" 
        style="z-index: 1; left: 45px; top: 255px; position: absolute; height: 51px; width: 445px">
    </asp:Panel>
    <asp:Label ID="Label1" runat="server" 
        style="z-index: 1; left: 62px; top: 268px; position: absolute; height: 28px; width: 92px" 
        Text="QuestionGroup" Font-Bold="True"></asp:Label>
    <asp:Button ID="ButtonMultichoice" runat="server" 
        style="z-index: 1; left: 396px; top: 502px; position: absolute; height: 33px; width: 91px" 
        Text="Create" onclick="ButtonMultichoice_Click" />
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 

        style="z-index: 1; left: 122px; top: 698px; position: absolute; height: 142px; width: 222px">
        <Columns>
            <asp:TemplateField HeaderText="Column Name"></asp:TemplateField>
            <asp:TemplateField HeaderText="Type "></asp:TemplateField>
            <asp:TemplateField HeaderText="Values"></asp:TemplateField>
        </Columns>
    </asp:GridView>
  </asp:Panel>

Upvotes: 0

Views: 2514

Answers (2)

Satpal
Satpal

Reputation: 133403

If you have set panel setting Visible="false" then the panel will not to render in the generated HTML. thus you will not be able to make it visible.

However if you want to show/hide using JavaScript. make use of display property of css with its value "block" or "none" as required

Upvotes: 2

Kamran Ajmal
Kamran Ajmal

Reputation: 302

You can do that by taking help of css for this Just write a css class that contains display:none; property and add that class to panel using Javascript like this 

document.getElementbyID("PanelID").className = CssclassName

Upvotes: 2

Related Questions