Bootstrap modal losing data when displayed

[David Cleeton]

When I step through the code I can see that the data is being assigned to the relevant controls (textbox or label) but nothing appears. In my project I have several other forms that also have popups and these work as they should. I have even used the code from these forms to try and solve the issue but with no success.

This is the code where the user clicks the button to display the popup

<div class="tab-pane fade" id="tabDiary">
<div class="col-md-12">
<asp:UpdatePanel ID="updatePanelDiary" runat="server">
<ContentTemplate>
<%--<asp:Timer ID="timerDiary" runat="server" Interval="15000" OnTick="timerDiary_Tick"></asp:Timer>--%>
<asp:Repeater ID="rptDiary" runat="server" OnItemDataBound="rptDiary_ItemDataBound">
<HeaderTemplate>
<div class="col-md-12 text-right">
<div class="form-group">
<asp:Button ID="btnDiary" runat="server" Text="New Diary Item" OnClick="btnDiary_Click" CssClass="btn btn-warning" Visible="true" />
<div class="clearfix"></div>
</div>
</div>
<table class="table table-striped table-bordered">
<thead>
<tr class="tabHeaderRow">
<td>Date</td>
<td>Entered By</td>
<td>Comments</td>
<td>Action Date</td>
<td></td>
</tr>
</thead>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%# DataBinder.Eval(Container.DataItem,"DateEntered") %></td>
<td><%# DataBinder.Eval(Container.DataItem,"AddedBy") %></td>
<td><%# DataBinder.Eval(Container.DataItem,"Comments") %></td>
<td><asp:Label ID="lblActionDate" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"ActionDate") %>'></asp:Label></td>
<td><asp:Button ID="btnEditDiaryEntry" runat="server" CssClass="btn btn-primary btn-sm" Text="Edit" CommandName="EditDiaryEntry"
OnCommand="btnEditDiaryEntry_Command" CommandArgument='<%#Eval("DiaryID") %>' /></td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div class="clearfix"></div>
</div>

This is the code behind:

protected void btnEditDiaryEntry_Command(object sender, CommandEventArgs e)
{
Int32 DiaryID = Convert.ToInt32(e.CommandArgument);
SqlCommand cmd = new SqlCommand("sp_GetDiaryEntry", cnn);
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@DiaryID", DiaryID);
cnn.Open();

SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
txtEditComment.Text = dr["Comments"].ToString();
txtEditScheduleDiary.Text = dr["ActionDate"].ToString();
}

dr.Close();
cnn.Close();
ScriptManager.RegisterStartupScript(_parentControl, _parentControl.GetType(), "Modal", " DisplayEditDiaryModal()", true);
Master.GetMenuData();
txtEditScheduleDiary.Text = "hello david";

}

And this is the code to display the popup

<script type="text/javascript">
function DisplayEditDiaryModal() {
$('#<%=pnlDiaryEdit.ClientID%>').modal('show');
}
</script>

This is the code for the modal:

<aspanel ID="pnlDiaryEdit" runat="server" class="modal fade" role="dialog">
<div class="modal-dialog modal-md">
<div class="modal-content">
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<div class="well well-md">
<fieldset>
<legend class="text-center header"><asp:Label ID="Label31" Text="Edit Diary Entry" runat="server" Visible="true"></asp:Label></legend>
<asp:HiddenField ID="hidDiaryID" runat="server" />

<div class="form-group">
<div class="col-md-3">
<asp:Label ID="lblEditComment" runat="server" Text="Comment"></asp:Label>
</div>
<div class="col-md-9">
<asp:TextBox ID="txtEditComment" runat="server" CssClass="form-control" TextMode="MultiLine" Rows="10" Wrap="true" ></asp:TextBox>
</div>
<div class="clearfix"></div>
</div>


<div class="form-group">
<div class="col-md-3">
<asp:Label ID="lblEditSchedule" runat="server" Text="Schedule Event"></asp:Label>
</div>
<div class="col-md-6">
<asp:TextBox ID="txtEditScheduleDiary" runat="server" CssClass="form-control" Visible="true" ></asp:TextBox>
</div>
<div class="clearfix"></div>
</div>

<div class="form-group">
<div class="col-md-12 text-right">
<asp:Button ID="btnCancelEdit" runat="server" Text="Cancel" CssClass="btn btn-primary" OnClientClick="HideEditDiaryModal(); return false;" />
<asp:Button ID="btnEditDiary" runat="server" Text="Edit" CssClass="btn btn-success" OnClick="btnEditDiary_Click" />
</div>
</div>

</fieldset>
</div>
</div>
</div>
</div>
</div>
</div>
</aspanel>


As I have already said this code works on other forms within the project. Any help would be much appreciated.

Continue reading...