Post
Ask Question
Kranthi Vardhan Kolluru

Kranthi Vardhan Kolluru

  • 1.1k
  • 497
  • 45.5k

Nested Gridview button click event

Aug 16 2017 1:09 AM
  1. <html xmlns="http://www.w3.org/1999/xhtml">  
  2. <head runat="server">  
  3.     <title></title>  
  4.     <style>  
  5.         .GrowStyle  
  6.         {  
  7.             padding: 0px;  
  8.             margin: 0px;  
  9.         }  
  10.         .leftpnl  
  11.         {  
  12.             padding: 10px;  
  13.             background-color: #cad5e2;  
  14.             height: 250px;  
  15.             border-radius: 10px;  
  16.         }  
  17.         .rightpnl  
  18.         {  
  19.             padding: 10px;  
  20.         }  
  21.         .divHead  
  22.         {  
  23.             border-radius: 10px;  
  24.             background-color: #333;  
  25.         }  
  26.         .tableR  
  27.         {  
  28.             padding: 0px;  
  29.             margin: 0px;  
  30.         }  
  31.         .tableR td  
  32.         {  
  33.         }  
  34.           
  35.         .divRes_Panel  
  36.         {  
  37.             padding: 5px;  
  38.         }  
  39.         .TabelRes_Panel  
  40.         {  
  41.             background-color: #fff; /*box-shadow: 1px 1px 1px #888888;*/  
  42.             -webkit-border-radius: 5px;  
  43.             -moz-border-radius: 5px;  
  44.             border-radius: 5px;  
  45.             -webkit-box-shadow: rgba(0,0,0,0.7) 1px 1px 2px;  
  46.             -moz-box-shadow: 1px 1px 2px #ddd;  
  47.             box-shadow: rgba(0,0,0,0.7) 1px 1px 2px;  
  48.             padding: 20px;  
  49.         }  
  50.         .TabelRes_Panel td  
  51.         {  
  52.             padding: 5px;  
  53.             padding-left: 10px;  
  54.         }  
  55.         .TabelRes_Panel_Head  
  56.         {  
  57.             border-radius: 5px 5px 0 0;  
  58.             background-color: #333;  
  59.             color: #fff;  
  60.         }  
  61.         .Head  
  62.         {  
  63.             background-color: #e5ecf5;  
  64.             padding: 5px;  
  65.         }  
  66.           
  67.         .Body  
  68.         {  
  69.             background-color: transparent;  
  70.         }  
  71.     </style>  
  72.       <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>  
  73.                                 <script language="javascript" type="text/javascript">  
  74.                                     function expandcollapsesub(obj, row) {  
  75.                                         var div = document.getElementById(obj);  
  76.                                         var img = document.getElementById('img' + obj);  
  77.   
  78.                                         if (div.style.display == "none") {  
  79.                                             $(div).slideToggle();  
  80.                                             div.style.display = "block"; //SHOW  
  81.   
  82.                                             if (row == 'alt') {  
  83.                                                 img.src = "images/minus.png";  
  84.                                             }  
  85.                                             else {  
  86.                                                 img.src = "images/minus.png";  
  87.                                             }  
  88.                                             img.alt = "Close to view other Customers";  
  89.                                             // return false;  
  90.                                         }  
  91.                                         else {  
  92.                                             $(div).slideUp();  
  93.                                             // div.style.display = "none"; //HIDE  
  94.                                             if (row == 'alt') {  
  95.                                                 img.src = "images/plus.png";  
  96.                                             }  
  97.                                             else {  
  98.                                                 img.src = "images/plus.png";  
  99.                                             }  
  100.                                             img.alt = "Expand to show Orders";  
  101.                                             // return false;  
  102.                                         }  
  103.   
  104.                                     }  
  105.   
  106.          
  107.                                 </script>  
  108. </head>  
  109. <body>  
  110.     <form id="form1" runat="server">  
  111.     <cc1:ToolkitScriptManager ID="scrimngr" runat="server">  
  112.     </cc1:ToolkitScriptManager>  
  113.     <div>  
  114.         <asp:UpdatePanel ID="updatePanel1" runat="server">  
  115.             <Triggers>  
  116.                 <asp:PostBackTrigger ControlID="chkAllQues" />  
  117.                 <asp:PostBackTrigger ControlID="btnshow1" />  
  118.                 <asp:PostBackTrigger ControlID="grdQues" />  
  119.             </Triggers>  
  120.             <ContentTemplate>  
  121.                 <div class="col-lg-12">  
  122.                     <div class="rightpnl">  
  123.                         <div class="table-responsive">  
  124.                             <table class="table divHead tableR" style="padding: 0px; margin-top: 20px; width: 100%">  
  125.                                 <tr>  
  126.                                     <td width="5%" style="color: #f3f3f3; padding: 10px;">  
  127.                                         <asp:LinkButton ID="lnkBack" runat="server" ForeColor="#f3f3f3" Font-Underline="false"  
  128.                                             ToolTip="Back" class="fa fa-2x fa-chevron-circle-left">  
  129.                                         </asp:LinkButton>  
  130.                                     </td>  
  131.                                     <td width="95%" style="border-top: 0px solid #fff">  
  132.                                         <asp:Label ID="lblSurTitle" runat="server" ForeColor="#54bbe7" Text="" Font-Size="25px"></asp:Label><br />  
  133.                                         <asp:Label ID="lbltitle" runat="server" ForeColor="#54bbe7" Text=""></asp:Label>  
  134.                                     </td>  
  135.                                 </tr>  
  136.                                 <tr>  
  137.                                     <td style="background-color: #cad5e2; color: #333; padding: 0px; margin: 0px;" colspan="2">  
  138.                                         <div style="padding: 0px; margin: 0px;">  
  139.                                             <%--#f3f3f3--%>  
  140.                                             <div class="pull-left" style="text-wrap: normal; background-color: #fdfdfd; border-radius: 5px 5px 0 0;  
  141.                                                 padding: 5px; margin-top: 10px; margin-left: 10px; text-align: center;">  
  142.                                                 <div class="fa fa-2x fa-bar-chart">  
  143.                                                 </div>  
  144.                                                 <asp:LinkButton ID="QS" Width="100px" runat="server" Text="Question Summaries" Font-Underline="false"  
  145.                                                     Font-Bold="true" ForeColor="Black"></asp:LinkButton></div>  
  146.                                             <%--<div class="pull-left" style="text-wrap:normal; background-color:#fff; border-radius:5px 5px 0 0; padding:5px; margin-top:10px; margin-left:10px; text-align:center;">  
  147.                                                 <asp:LinkButton ID="DT" runat="server" Text="Data Trends" Font-Underline="false" Font-Bold="false" ></asp:LinkButton></div>  
  148.                                             <div class="pull-left" style="text-wrap:normal; background-color:#fff; border-radius:5px 5px 0 0; padding:5px; margin-top:10px; margin-left:10px; text-align:center;">  
  149.                                                 <asp:LinkButton ID="IR" runat="server" Text="Individual Responses" Font-Underline="false" Font-Bold="false" ></asp:LinkButton></div>--%>  
  150.                                         </div>  
  151.                                     </td>  
  152.                                 </tr>  
  153.                                 
  154.                                 <tr>  
  155.                                     <td style="background-color: #fdfdfd; border-top: 0px solid #f3f3f3; padding: 15px;  
  156.                                         width: 40%;" colspan="2">  
  157.                                         <div style="width: 200px; background-color: skyblue">  
  158.                                             <a href="javascript:expandcollapsesub('div<%# Eval("slno") %>', 'one');" style="font-weight: 600;  
  159.                                                 color: #000;">  
  160.                                                 <img id="imgdiv<%# Eval("slno") %>" alt="Click to show/hide Response <%# Eval("slno") %>"  
  161.                                                     border="0" src="Images/plus.png" /><b style="background-color: skyblue">CUSTOMERS LIST</b></a>  
  162.                                         </div>  
  163.                                         <div id="div<%# Eval("slno") %>" style="display: none; background-color: #ffffff;  
  164.                                             border: 2px solid skyblue; position: relative; left: 0px; overflow: auto; width: 20%;  
  165.                                             padding: 10px;">  
  166.                                             <asp:CheckBox ID="chkAllQues" runat="server" Checked="true" AutoPostBack="true" OnCheckedChanged="chkAllQues_CheckedChanged"  
  167.                                                 Text="Select All" />  
  168.                                             <asp:Panel runat="server" ID="Panel1" ScrollBars="Vertical" Height="200px">  
  169.                                                 <asp:GridView ID="grdQues" runat="server" AutoGenerateColumns="false" SkinID="myGreen"  
  170.                                                     ShowFooter="true" Width="100%" OnRowDataBound="grdQues_RowDataBound">  
  171.                                                     <Columns>  
  172.                                                         <asp:TemplateField HeaderText="  ">  
  173.                                                             <ItemTemplate>  
  174.                                                                 <asp:CheckBox ID="chkIsQues" runat="server" Checked="true" />  
  175.                                                             </ItemTemplate>  
  176.                                                             <ItemStyle Width="5%" />  
  177.                                                         </asp:TemplateField>  
  178.                                                         <asp:TemplateField>  
  179.                                                             <ItemTemplate>  
  180.                                                                 <asp:Label ID="lblQID" runat="server" Text='<%#Eval("slno") %>'></asp:Label>  
  181.                                                             </ItemTemplate>  
  182.                                                             <ItemStyle Width="1%" />  
  183.                                                         </asp:TemplateField>  
  184.                                                         <asp:TemplateField HeaderText="Questions">  
  185.                                                             <ItemTemplate>  
  186.                                                                 <asp:Label ID="lblDesc" runat="server" Text='<%#Eval("name") %>'></asp:Label>  
  187.                                                                 <asp:Label ID="lblSDQuesId" runat="server" Text='<%#Eval("slno") %>' Visible="false"></asp:Label>  
  188.                                                             </ItemTemplate>  
  189.                                                             <ItemStyle Width="94%" />  
  190.                                                         </asp:TemplateField>  
  191.                                                         <asp:TemplateField>  
  192.                                                             <FooterTemplate>  
  193.                                                                 <asp:Button ID="btnS" runat="server" OnClick="btnshow_Click" Text="ShowUp" />  
  194.                                                             </FooterTemplate>  
  195.                                                         </asp:TemplateField>  
  196.                                                     </Columns>  
  197.                                                     <FooterStyle />  
  198.                                                 </asp:GridView>  
  199.                                             </asp:Panel>  
  200.                                             <br />  
  201.                                             <asp:UpdatePanel ID="Updatepanel2" runat="server">  
  202.                                                 <ContentTemplate>  
  203.                                                     <asp:Button ID="btnshow1" runat="server" Text="Show Report" CssClass="btn"   
  204.                                                         BorderStyle="Double" BorderColor="#f2f2f2" ForeColor="#ffffff" Font-Bold="true" OnClientClick="return btnshow_Click;"  
  205.                                                         BorderWidth="5" Style="padding: 8px; border-radius: 5px; background-color: #54bbe7;  
  206.                                                         color: #323232;" />  
  207.                                                 </ContentTemplate>  
  208.                                             </asp:UpdatePanel>  
  209.                                         </div>  
  210.                                     </td>  
  211.                                 </tr>  
  212.                                 <tr>  
  213.                                     <td>  
  214.                                     <asp:Label ID="lblmsg" runat="server" ForeColor="Red"></asp:Label>  
  215.                                     </td>  
  216.                                 </tr>  
  217.                             </table>  
  218.                         </div>  
  219.                     </div>  
  220.                 </div>  
  221.             </ContentTemplate>  
  222.         </asp:UpdatePanel>  
  223.     </div>  
  224.     </form>  
  225. </body>  
  226. </html>  
code behind is
 
  1. protected void Page_Load(object sender, EventArgs e)  
  2.    {  
  3.        if (!IsPostBack)  
  4.        {  
  5.            BindGrid();  
  6.        }  
  7.    }  
  8.    void BindGrid()  
  9.    {  
  10.        DataTable dt = new DataTable();  
  11.        DataRow dr = null;  
  12.   
  13.        dt.Columns.Add(new DataColumn("slno", typeof(string)));  
  14.        dt.Columns.Add(new DataColumn("Name", typeof(string)));  
  15.        dt.Columns.Add(new DataColumn("Access", typeof(string)));  
  16.        dr = dt.NewRow();  
  17.        dr["slno"] = 1;  
  18.        dr["Name"] = "kranthi";  
  19.        dr["Access"] = string.Empty;  
  20.        dt.Rows.Add(dr);  
  21.        dr = dt.NewRow();  
  22.        dr["slno"] = 2;  
  23.        dr["Name"] = "RAVI";  
  24.        dr["Access"] = string.Empty;  
  25.        dt.Rows.Add(dr);  
  26.        dr = dt.NewRow();  
  27.        dr["slno"] = 3;  
  28.        dr["Name"] = "SASI";  
  29.        dr["Access"] = string.Empty;  
  30.        dt.Rows.Add(dr);  
  31.        ViewState["DT"] = dt;  
  32.        grdQues.DataSource = dt;  
  33.        grdQues.DataBind();  
  34.    }  
  35.    protected void btnshow_Click(object sender, EventArgs e)  
  36.    {  
  37.        //strMultiQues = string.Empty;  
  38.        //foreach (GridViewRow grdrowitem in grdQues.Rows)  
  39.        //{  
  40.        //    CheckBox chkIsQues = (CheckBox)grdrowitem.FindControl("chkIsQues");  
  41.        //    if (chkIsQues.Checked)  
  42.        //    {  
  43.        //        Label lblSDQuesId = (Label)grdrowitem.FindControl("lblSDQuesId");  
  44.        //        strMultiQues = strMultiQues + lblSDQuesId.Text + ",";  
  45.        //    }  
  46.        //}  
  47.   
  48.        //GetResponseData();  
  49.        lblmsg.Text = "Button click event!!";  
  50.    }  
  51.    protected void grdQues_RowDataBound(object sender, GridViewRowEventArgs e)  
  52.    {  
  53.        if (e.Row.RowType == DataControlRowType.DataRow)  
  54.        {  
  55.            e.Row.Attributes.Add("onmouseover", "this.originalstyle=this.style.backgroundColor;this.style.backgroundColor='#EEFFAA';this.style.cursor = 'pointer';");  
  56.            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=this.originalstyle;this.style.cursor = 'pointer';");  
  57.        }  
  58.    }  
  59.    protected void chkAllQues_CheckedChanged(object sender, EventArgs e)  
  60.    {  
  61.        if (chkAllQues.Checked)  
  62.        {  
  63.            foreach (GridViewRow grdrowitem in grdQues.Rows)  
  64.            {  
  65.                CheckBox chkIsQues = (CheckBox)grdrowitem.FindControl("chkIsQues");  
  66.                chkIsQues.Checked = true;  
  67.            }  
  68.        }  
  69.        else  
  70.        {  
  71.            foreach (GridViewRow grdrowitem in grdQues.Rows)  
  72.            {  
  73.                CheckBox chkIsQues = (CheckBox)grdrowitem.FindControl("chkIsQues");  
  74.                chkIsQues.Checked = false;  
  75.            }  
  76.        }  
  77.    }  
My problem is when i click on button or select checkbox or any other event the nested grid isdclosing automatically. i want  to rise the events if the nested grid is in expand state that would be in expand state only when the button click event raise. I think the Javascript is runnig automatically on every event fired. please help

Answers (2)