asp.net - checkbox inside a gridview within updatepanel

Question

I have a gridview with a checkbox in first column. I set checkbox property of autopostback="true". The gridview is inside the updatepanel. When checkbox is checked i want to make one panel as visible, which panel is outside the update panel. I check the code with check point, which is go through the code, but its not working. Can any one help me?..

Thanks in advance.

My code is here for your reference...

HTML Code:

<asp:Panel ID="ploperation" runat="server" CssClass="plop" Visible="False">
    <asp:LinkButton ID="lbtnasspam" runat="server" CssClass="panelbtn" Font-Names="Calibri"
                    Font-Size="14px" Font-Underline="False" OnClick="lbtnasspam_Click">Report As Spam</asp:LinkButton>
</asp:Panel>

 <asp:UpdatePanel ID="up" runat="server">
     <ContentTemplate>
         <asp:GridView ID="gvmail" runat="server" AllowPaging="True" AutoGenerateColumns="False">

              <Columns>
                  <asp:TemplateField>
                      <ItemTemplate>
                          <asp:CheckBox ID="chkchild" runat="server" AutoPostBack="true" OnCheckedChanged="chkchild_CheckedChanged"/>
                      </ItemTemplate>
                      <ItemStyle Width="15px" />
                  </asp:TemplateField>
              </Columns>         
         </asp:GridView>
     </ContentTemplate>                        
</asp:UpdatePanel>

C# Code:

protected void chkchild_CheckedChanged(object sender, EventArgs e)
{
    ploperation.Visible = true;
}

Answer 1

You can use initializeRequest - this event is raised when an asynchronous post back occurs(When you check the checkbox in your gridview it initiates an async postback because it's inside an update panel).

Just change ploperation to a div instead of <asp:Panel and you can use javascript to show/hide it:

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<script type="text/javascript">
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(initializeRequest);

    function initializeRequest(sender, args) {
        document.getElementById('ploperation').style.display = 'block';
    }

</script>
<asp:UpdatePanel ID="up" runat="server">
    <ContentTemplate>
        <asp:GridView ID="gvmail" runat="server" AllowPaging="True" AutoGenerateColumns="False">
            <Columns>
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:CheckBox ID="chkchild" runat="server" AutoPostBack="true" />
                    </ItemTemplate>
                    <ItemStyle Width="15px" />
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
    </ContentTemplate>
</asp:UpdatePanel>
<div id="ploperation" style="display:none;" runat="server">
    <asp:LinkButton ID="lbtnasspam" runat="server" CssClass="panelbtn" Font-Names="Calibri"
        Font-Size="14px" Font-Underline="False" OnClick="lbtnasspam_Click">Report As Spam</asp:LinkButton>
</div>
</form>

Alternatively you can stick to the way you've done it, just place <asp:Panel inside UpdatePanel -> ContentTemplate

Answer 2

update panel does partial page loading.... check link

so if you want to show your panel than include it also in your update panel.

Answer 3

Put the UpdatePanel on the control you want to change, not on the GridView. Do not forget to Reference the GridView on the Triggers section. For example, if you want to change a label text use the following code:

<asp:UpdatePanel ID="up" runat="server">
<ContentTemplate>
    <asp:Label ID="Label1" runat="server" Text="" />
</ContentTemplate>
<Triggers>
        <asp:AsyncPostBackTrigger ControlID="gvmail"  />
</Triggers>
</asp:UpdatePanel>

<asp:GridView ID="gvmail" runat="server" AllowPaging="True" AutoGenerateColumns="False">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:CheckBox ID="chkchild" runat="server" AutoPostBack="true" OnCheckedChanged="chkchild_CheckedChanged"/>
            </ItemTemplate>
            <ItemStyle Width="15px" />
        </asp:TemplateField>
    </Columns>         
</asp:GridView>