jQueryアコーディオンに設定されたプロジェクトのリストがあります。
また、ユーザーがそのプロジェクトに関する情報を入力するカスタムユーザーコントロールもあります。(いくつかのドロップダウン、テキストボックス、および送信ボタンだけです。)ユーザーが情報を追加するためにクリックすると、コントロールがカラーボックスを介してポップアップします。
<a class="colorBoxLink" href="javascript:void(0);">Add Info</a>
<asp:Repeater ID="rptProjectList" OnItemDataBound="rptProjects_ItemDataBound" runat="server">
<HeaderTemplate>
<div id="accordion">
</HeaderTemplate>
<ItemTemplate>
<h1 style="margin: 0px" class="accordionHeader" id='P<%# Eval("projectCode") %>'>
<asp:Label ID="lblProjCode" runat="server" Text='<%# Eval("projectCode") %>'></asp:Label>
- <%# Eval("title") %>
<p style="color: red; margin: 0px">Deadline: <%# Eval("deadline", "{0:d MMM yy}") %> ECD: <%# Eval("ecd", "{0:d MMM yy}") %></p>
</h1>
<div>
<asp:Repeater ID="rptCompletedProjectTasks" OnItemDataBound="rptCompletedProjectTasks_ItemDataBound" runat="server">
<HeaderTemplate>
<h3>Completed Tasks</h3>
<table class="projTaskTable">
<tr>
<th style="width: 100px">W/C</th>
<th style="width: 450px">Description</th>
<th style="width: 100px">Due</th>
<th style="width: 100px">Completed</th>
<th style="width: 50px">Var</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td id="tdWeek" runat="server">
<asp:Label ID="lblWeek" runat="server" Text='x'></asp:Label></td>
<td><%# Eval("description") %></td>
<td><%# Eval("deadline", "{0:d MMM}") %></td>
<td>
<asp:Label ID="lblCompleted" runat="server" Text='<%# Eval("completedDate", "{0:d MMM}") %>'></asp:Label></td>
<td><%# Eval("var") %></td>
</tr>
</ItemTemplate>
<FooterTemplate></table></FooterTemplate>
</asp:Repeater>
</div>
</ItemTemplate>
<FooterTemplate>
</div>
</FooterTemplate>
</asp:Repeater>
<div id="popup" style="display: none; height: 320px">
<uc1:TaskCreator runat="server" ClientIDMode="static" ProjectCode="X" ID="TaskCreator" />
</div>
現在選択されているアコーディオンのインデックスをユーザーコントロールに渡すことができる必要があります。(つまり、ユーザーがプロジェクトXYZのヘッダーをクリックし、[追加]をクリックしてユーザーコントロールをポップアップします。次に、ユーザーがコントロールでフォームを送信するときに、プロジェクトXYZが選択されたことを「知る」必要があります。これは、更新されるプロジェクトになるためです。 。)