Hi Experts,
I have a Modal jQuery pop-up opens from c# code. My pop-up has an updatePanel, I had a problem with postback when clicking asp:Button or check a checkbox, but i solved it by moving the dialogue back into the form.
Now I have added a FileUpload control to the updatePanel. and the control loses its file once i check checkbox or clicking the button, so I had to add a trigger to my updatePanel. But with the trigger the pop-up returned to close again on button click.
Here is my javaScript for the modal Pop-up:
<!-- popup javascript and links -->
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"/>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
function showmodalpopup() {
var dlg = jQuery("#popupdiv").dialog({
title: "Edit IC data",
width: 1000,
height: 500,
modal: true
});
dlg.parent().appendTo(jQuery("form:first"));
};
</script>
Here is how I open it from code behind (calling it from ListView ItemCommand):
if (e.CommandName == "editRow")
{
ScriptManager.RegisterStartupScript(this, GetType(), "Show Modal Popup", "showmodalpopup();", true);
}
My pop-up div:
<div id="popupdiv" title="Basic modal dialog" style="display: none">
<div class="span12" style="text-align:left;margin-removed0px;">
<table class="table table-hover table-striped table-condensed" style="margin-removed 0px;">
<tr style="background-color: #10466E;">
<th>Function</th>
<th>Color</th>
<th>Polarity</th>
<th>Location</th>
<th>Files</th>
<th>Notes</th>
</tr>
<tr>
<td><asp:TextBox runat="server" ID="txtFunction" Enabled="false"></asp:TextBox></td>
<td><asp:TextBox runat="server" ID="txtColor"></asp:TextBox></td>
<td><asp:TextBox runat="server" ID="txtPolarity"></asp:TextBox></td>
<td><textarea runat="server" id="txtLocation"></textarea></td>
<td>
<asp:FileUpload runat="server" ID="picFile" /><br />
<asp:RegularExpressionValidator ID="fileValid" runat="server" ControlToValidate="picFile" ErrorMessage="Only .png or .jpg" ValidationExpression="^(([a-zA-Z]:)|(\\{2}\w+)\$?)(\\(\w[\w].*))(.jpg|.jpeg|.png)$" Display="Dynamic" ForeColor="Red"></asp:RegularExpressionValidator>
</td>
<td><textarea runat="server" id="txtNotes"></textarea></td>
</tr>
</table>
<div class="span6" style="text-align:left;">
<asp:UpdatePanel runat="server" ID="updatePanel1">
<Triggers>
<asp:PostBackTrigger ControlID="btnUpdate" />
</Triggers>
<ContentTemplate>
<asp:CheckBoxList runat="server" ID="chkVehicles" DataTextField="Vehicle" DataValueField="Id" AutoPostBack="true" OnSelectedIndexChanged="chkVehicles_SelectedIndexChanged">
</asp:CheckBoxList>
<asp:Button runat="server" ID="btnUpdate" Text="Update" CssClass="con-tbutton" OnClick="btnUpdate_Click" UseSubmitBehavior="false" /><br />
<asp:Label runat="server" ID="lbl_Result"></asp:Label><br /><asp:Label runat="server" ID="lbl_UpdateMessage"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</div>
Everything works very well, except that the modal pop-up closes once I click the update Button.
Please advise
thanks in advance