User1587720337 posted
I am working on the nested grid and able to display the child grid data when i click on the expand button.
Problem: All child grid column is showing in the second column of the parent grid, I want to align child grid column to each parent grid column. Attaching the image for the reference: https://ibb.co/121LKz0
ASPX Coding:
<style type="text/css">
body
{
font-family: Times New Roman;
font-size: 10pt;
}
.Grid th
{
background-color: #DF7401;
color: White;
font-size: 10pt;
line-height:200%;
}
.Grid td
{
background-color: #F3E2A9;
color: black;
font-size: 10pt;
line-height:200%;
text-align:center;
}
.ChildGrid th
{
background-color: Maroon;
color: White;
font-size: 10pt;
}
.ChildGrid td
{
background-color: Orange;
color: black;
font-size: 10pt;
text-align:center;
}
</style>
<asp:GridView ID="gvGrid" runat="server" CellPadding="4" AllowPaging="True" AutoGenerateColumns="False" Font-Size="16px" PageSize="12" OnRowDataBound="gvGrid_OnRowDataBound" ShowHeader="true" OnPageIndexChanging="gvGrid_PageIndexChanging" OnSorting="gvGrid_Sorting"
AllowSorting="true" DataKeyNames="TMTMSGID" OnRowCommand="gvGrid_RowCommand1" CssClass="Grid">
<Columns>
<asp:TemplateField ItemStyle-VerticalAlign="Top" ItemStyle-Width="20px">
<ItemTemplate>
<asp:ImageButton runat="server" ID="btnExpand" CommandArgument='<%# Eval("TMTMSGID") %>'
CommandName="Select"
Text="Select" ImageUrl="~/App_Themes/Images/grow.png" Width="20" Height="20" />
<asp:ImageButton runat="server" ID="btnCollapse" CommandArgument='<%# Eval("TMTMSGID") %>'
CommandName="DeSelect"
Text="Show All" Visible="false" ImageUrl="~/App_Themes/Images/minus.png" Width="20" Height="20" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Sent From " SortExpression="SenderName">
<ItemTemplate>
<asp:Label ID="lblSender" runat="server" Text='<%# Bind("SenderName") %>' ToolTip='<%# Bind("SenderNameToolTip") %>' ></asp:Label>
<asp:Label ID="lblOutboundID" runat="server" Visible="false"></asp:Label>
<asp:HiddenField ID="hdID" runat="server" />
<asp:Panel ID="pnlMain" runat="server" Visible="false" >
<br /> <br />
<br />
<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="false" DataKeyNames="TMTMSGID" OnSorting="GridView2_Sorting" AllowSorting="true" EnableSortingAndPagingCallbacks="false" ClientIDMode="Static" EnableViewState="true" OnRowDataBound="GridView2_OnRowDataBound"
CssClass="ChildGrid">
<Columns>
<asp:TemplateField HeaderText="Response From" ControlStyle-Font-Bold="false" HeaderStyle-Font-Bold="false" SortExpression="SenderNameWithPhone">
<ItemTemplate>
<asp:HiddenField ID="hdSenderPhoneNumber" runat="server" Value='<%# Bind("Phone1") %>' />
<asp:HiddenField ID="hdClientPhoneNumber" runat="server" Value='<%# Bind("ClientMsgPhone1") %>' />
<asp:HiddenField ID="hdTMTMsgID" runat="server" Value='<%# Bind("TMTMsgID") %>' />
<asp:Label ID="lblContact" runat="server" Text='<%# Eval("SenderName") %>' ToolTip='<%# Eval("SenderNameWithPhone") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<%-- <asp:TemplateField HeaderText="Date/Time" ControlStyle-Font-Bold="false" HeaderStyle-Font-Bold="false" SortExpression="SentDatetime">
<ItemTemplate>
<asp:Label ID="lblSentDatetime" runat="server" Text='<%# Eval("SentDatetime") %>' ToolTip='<%# Eval("SentDatetime") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>--%>
</Columns>
</asp:GridView>
</asp:Panel>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Date/Time" SortExpression="SentDateTime">
<ItemTemplate>
<asp:Label ID="lblSentDateTime" runat="server" Text='<%# Bind("SentDateTime") %>' ToolTip="Date/Time the message was sent" Width="150px"></asp:Label>
<asp:HiddenField ID="hdImages" runat="server" Value='<%# Bind("TMTMsgID") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Outbound Message" SortExpression="MsgTxt">
<ItemTemplate>
<asp:Label ID="lblMsgTxt" runat="server" Height="20" Text='<%# Bind("MsgTxt") %>' ToolTip="Message Text"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Outbound Media" SortExpression="SenderName">
<ItemTemplate>
<asp:DataList ID="dlImages" RepeatDirection="Horizontal" runat="server" CellPadding="15" CellSpacing="15" align="left">
<ItemTemplate>
<a href="MediaLibraryActualImageDialog.aspx?ImageUrl=<%# DataBinder.Eval(Container.DataItem, "ImageURL") %>&ID=0" style="font-size: 14px !important; width: 20px !important;" target="_blank" onclick="window.open('MediaLibraryActualImageDialog.aspx?ImageUrl=<%#
DataBinder.Eval(Container.DataItem, "ImageURL") %>', 'myWin', 'toolbar=no, directories=no, location=no, status=yes, menubar=no, resizable=no, scrollbars=yes', 'width=530, height=80, left='+((screen.width - 530) / 2)+', top=' + ((screen.heigth - 80) / 2));
return false">
<asp:ImageButton ID="lblID" runat="server" ImageUrl='<%# Bind("ImageURL") %>' Width="50" Height="50" Visible='<%# Eval("ImageURL")!=DBNull.Value %>'></asp:ImageButton></a>
</ItemTemplate>
</asp:DataList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText=" Duration" SortExpression="MsgExpireTime" HeaderStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Label ID="lblExpireTime" runat="server" Text='<%# Bind("MsgExpireTime") %>' ToolTip="Duration (minutes) allowed for a reply to the message" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText=" Replies" SortExpression="SenderName" HeaderStyle-HorizontalAlign="Center">
<ItemTemplate>
<asp:Label ID="lblRecipients" runat="server" Text='<%# Bind("CountMessage") %>' ToolTip="Recipients / Replies"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Any idea how we can align the child grid column to parent grid column
