sbornstein2
asked on
ASP.Net/C# - Repeater in GridView
If I have a repeated inside a gridview and the repeater has #Eval(DataBind... in it as well that I want to be the same databound as the gridview it is nested in, how do I do that? I have a collapsable gridview and using a <div style="display:none"> where the repeater really is only going to have one record the same for the gridview row how can I do that? I am not sure this is the best way but I was wanting to have an expandable gridview row that I could show more columns in the expanded row below the row. If there is a better way I am all for it. Posted here is my ASCX code.
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="JobPanelRepeater.ascx.cs" Inherits="BillrunWeb.JobPanelRepeater" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<link id="Link1" runat="server" rel="stylesheet" href="~/App_Themes/Billfest/billfest.css" type="text/css" />
<script language="javascript">
function ExpandCollapseMileStoneDetail(image, index)
{
// get the source of the image
var src = image.getAttribute("src");
// if src is currently "icon-expand.png", then toggle it to "icon-collapse.png"
if(src.indexOf("expand")>0)
{
// toggle the image
image.src = src.replace("expand","collapse");
// Get a reference to the current row where the image is
var tr = image.parentNode.parentNode;
// Get a reference to the next row from where the image is
var next_tr = tr.nextSibling;
// Get a refernece to the <tbody> tag of the grid
var tbody = tr.parentNode;
// Get a reference to the image's column
var td = image.parentNode;
var detailnode
//loop through the content of the image's column. if hidden div is found, get a reference
for(var j =0; j<td.childNodes.length; j++)
{
if(td.childNodes[j].nodeType == 1)
{
if(td.childNodes[j].nodeName.toLowerCase() == 'div')
{
detailnode = td.childNodes[j].cloneNode(true);
detailnode.setAttribute('style','');
}
}
}
// Create a new table row for "Expand"
var newtr = document.createElement('tr');
var newtd = document.createElement('td');
var newfirsttd = newtd.cloneNode(true);
/* insert an empty cell first */
// var newempttd = document.creatElement('td');
// newempttd.innerHTML= " ";
newfirsttd.innerHTML=' ';
newtr.appendChild(newfirsttd);
newtd.colSpan = 5;
// insert the hidden div's content into the new row
newtd.innerHTML = detailnode.innerHTML;
newtr.appendChild(newtd);
tbody.insertBefore(newtr, next_tr);
tr.className = "selected";
}
else{
image.src = src.replace("collapse","expand");
var row = image.parentNode.parentNode;
var rowsibiling = row.nextSibling;
var rowparent = row.parentNode;
rowparent.removeChild(rowsibiling);
if(index%2==0)
{
row.className = "odd";
}
else{
row.className = "even";
}
}
}
</script>
<asp:Timer ID="Timer1" OnTick="updatePanel" runat="server" Interval="10000" />
<asp:Literal id="ltlConfirm" runat="server" EnableViewState="False"/>
<asp:UpdatePanel runat="server" ID="StepPanel" UpdateMode="Conditional" >
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1" />
</Triggers>
<ContentTemplate>
<div id="panel-grid">
<asp:GridView ID="RepeaterGrid" runat="server" AllowSorting="False" AutoGenerateColumns="False" EnableViewState="False" OnRowCreated="RepeaterGrid_RowCreated" >
<RowStyle CssClass="odd" />
<AlternatingRowStyle CssClass="even" />
<HeaderStyle CssClass="header" />
<Columns>
<asp:TemplateField>
<ItemTemplate>
<img id="CollpaseExpand" runat="server" src="../images/expand.jpg"
alt="Hide Detail" />
<div style="display:none">
<asp:Repeater ID="RepeaterJobs" runat="server">
<HeaderTemplate>
<table id="control" bgcolor="white" cellspacing="0" cellpadding="2" style="border: thin;font-size:small; font-family: Tahoma;">
<tr valign=top>
<td class="header" align="center">Prints</td>
<td class="header" align="center">Webs</td>
<td class="header" align="center">Emails</td>
<td class="header" align="center">CDRs</td>
<td class="header" align="center">Actions</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table id="Table1" bgcolor="white" cellspacing="0" cellpadding="2" style="border: thin;font-size:small; font-family: Tahoma;">
<tr valign=top>
<td>
<div style="border: solid 1px">
<table>
<tr>
<td width="20px" align="right">
<asp:Button Text="Rej" ID="btnRejecPrint" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReject_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'" />
</td>
<td width="20px" align="right">
<asp:Button Text="Reg" ID="btnReGenPrint" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReGen_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
</tr>
</table>
</div>
</td>
<td>
<div style="border: solid 1px">
<table>
<tr>
<td width="20px" align="right">
<asp:Button Text="Rej" ID="btnRejectWeb" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReject_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
<td width="20px" align="right">
<asp:Button Text="Reg" ID="btnRegenWeb" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReGen_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
</tr>
</table>
</div>
</td>
<td>
<div style="border: solid 1px">
<table>
<tr>
<td width="20px" align="right">
<asp:Button Text="Rej" ID="btnRejectEmail" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReject_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
<td width="20px" align="right">
<asp:Button Text="Reg" ID="btnReGenEmail" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReGen_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
</tr>
</table>
</div>
</td>
<td>
<div style="border: solid 1px">
<table>
<tr>
<td width="20px" align="right">
<asp:Button Text="Rej" ID="btnRejectCDR" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReject_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
<td width="20px" align="right">
<asp:Button Text="Reg" ID="btnReGenCDR" runat="server" CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnReGen_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
</tr>
</table>
</div>
</td>
<td>
<div style="border: solid 1px">
<table>
<tr>
<td>
<asp:Button Text="Ungenerate Job" ID="btnUnGen" runat="server" Width="135px" Enabled=<%#GetUngenerateState(Eval("ARCHIVED_IND"),Eval("VD_ARCHIVED_IND"),Eval("STATUS_CODE"),Eval("EMAIL_NOTIFIED")) %> CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnUnGen_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'"/>
</td>
<td>
<asp:Button ID="btnPublish" runat="server" width="135px" Text=<%#GetPublishText(Eval("ARCHIVED_IND"), Eval("VD_ARCHIVED_IND"), Eval("STATUS_CODE"), Eval("EMAIL_NOTIFIED")) %> Enabled=<%#GetPublishState(Eval("ARCHIVED_IND"), Eval("VD_ARCHIVED_IND"), Eval("STATUS_CODE"), Eval("EMAIL_NOTIFIED")) %> CommandArgument='<%#Eval("BILLING_JOB_ID")%>' CommandName='<%# GetServerName(Eval("ENGINE_IP"))%>' OnClick="btnPublish_Click" onmouseover="this.className='inputhov'" onmouseout="this.className='input.btn'" />
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</ItemTemplate>
<FooterTemplate></FooterTemplate>
</asp:Repeater>
</div>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Job ID
</HeaderTemplate>
<ItemTemplate>
<%#Eval("BILLING_JOB_ID")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Job Name
</HeaderTemplate>
<ItemTemplate>
<%#Eval("BILLING_JOB_NAME").ToString().Length > 16 ? Eval("BILLING_JOB_NAME").ToString().Substring(0, 16) + "..." : Eval("BILLING_JOB_NAME").ToString()%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Cust CT
</HeaderTemplate>
<ItemTemplate>
<%#Eval("CUST_CT")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Started
</HeaderTemplate>
<ItemTemplate>
<%#Eval("STARTED")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Finished
</HeaderTemplate>
<ItemTemplate>
<%#Eval("FINISHED")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Duration
</HeaderTemplate>
<ItemTemplate>
<%#Eval("ELAPSED_TIME")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Progress
</HeaderTemplate>
<ItemTemplate>
<div>
<div>
<asp:Image ID="JobProgress" width="70px" ImageUrl=<%# LoadJobProgress(Eval("S_STEP"))%> runat="server" />
<div style="margin-top:-20px;width:70px;text-align:center;">
<asp:Label ID="lblJobStep" width="70px" runat="server" text='<%#GetJobStep(Eval("S_STEP"), Eval("FINISHED")).ToString().Length > 8 ? GetJobStep(Eval("S_STEP"), Eval("FINISHED")).ToString().Substring(0, 8) + "..." : GetJobStep(Eval("S_STEP"), Eval("FINISHED")).ToString()%>'></asp:Label>
</div>
</div>
</div>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Prints
</HeaderTemplate>
<ItemTemplate>
<%#Eval("PRINT_COMP")%>/<%#Eval("PRINT_CT")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Webs
</HeaderTemplate>
<ItemTemplate>
<%#Eval("WEB_COMP")%>/<%#Eval("WEB_CT")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
Emails
</HeaderTemplate>
<ItemTemplate>
<%#Eval("EMAIL_COMP")%>/<%#Eval("EMAIL_PDF")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
CDRs
</HeaderTemplate>
<ItemTemplate>
<%#Eval("CDR_COMP")%>/<%#Eval("CDR_CT")%>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
CDRs
</HeaderTemplate>
<ItemTemplate>
<%#Eval("CDR_COMP")%>/<%#Eval("CDR_CT")%>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</ContentTemplate>
</asp:UpdatePanel>
jinal
In that case you also have to define datasource for Repeater ?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I will be reviewing this tomorrow all and will award tomorrow, thanks for all the input it is much appreciated.
ASKER
jinal:getting the following error on the datasource container item on the repeater:
An exception of type 'System.ArgumentException'
Additional information: An invalid data source is being used for RepeaterJobs. A valid data source must implement either IListSource or IEnumerable.
An exception of type 'System.ArgumentException'
Additional information: An invalid data source is being used for RepeaterJobs. A valid data source must implement either IListSource or IEnumerable.
ASKER
not sure if there is a better way to do this based on the fact there will always only always be one record I want below the main record an extension really of the fields in the record but on the next line so the user does not have to scroll left to right. I could do this with the repeater but the problem is we need the rows to be expandable with a expand "+" sign and "-" sign.
ASKER
thanks