Jul 26, 2011, 8:00 AM
[CLOSED] Browser Progress Bar is still in process...
Hi:
I have a Attachment page (Test.aspx) which will be opened as a popup page from Main Page (TestParent.aspx).
In the Attachment page i have a window to browse a file and upload it to server. The file is getting uploaded and the window is getting closed perfectly, the only issue is Browser progress Bar is still shown as processing... as follows

But this isssue not comes when i comment the Loading Mask code set for OK buttons DirectEvent, so i can say definetly this is a bug of Coolite Mask. pls find the below code to simulate the Bug. also provide me a solution to fix this.
Note: Include the CSS of yours, change the file save directory of your own and make a test.
TestParent.aspx
I have a Attachment page (Test.aspx) which will be opened as a popup page from Main Page (TestParent.aspx).
In the Attachment page i have a window to browse a file and upload it to server. The file is getting uploaded and the window is getting closed perfectly, the only issue is Browser progress Bar is still shown as processing... as follows
But this isssue not comes when i comment the Loading Mask code set for OK buttons DirectEvent, so i can say definetly this is a bug of Coolite Mask. pls find the below code to simulate the Bug. also provide me a solution to fix this.
Note: Include the CSS of yours, change the file save directory of your own and make a test.
TestParent.aspx
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>FormPanel - Ext.NET Examples</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Store ID="storeAttachment" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="AttachmentFile">
</ext:RecordField>
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Panel ID="Panel1" runat="server" Width="800" Height="600">
<Content>
<table width="800px">
<tr>
<td>
<ext:Button ID="btnProcessAttachment" runat="server" Text="Process Attachment">
<Listeners>
<Click Handler="ShowPopup();" />
</Listeners>
</ext:Button>
</td>
</tr>
<tr>
</tr>
</table>
</Content>
</ext:Panel>
</form>
<script type="text/javascript" language="javascript">
var win1;
function ShowPopup() {
page = "test.aspx";
var isExist = Ext.isEmpty(Ext.getCmp('c2'));
if (isExist == true) {
win1 = new Ext.Window({
modal: false,
layout: 'absolute',
width: 800,
height: 600,
title: 'Attachment Popup Window',
closable: true,
closeAction: 'destroy',
resizable: false,
autoLoad: { showMask: true, maskMsg: 'Loading ...', scripts: true, mode: "iframe", url: page },
autoScroll: false,
collapsible: true,
id: "c2"
});
win1.width = 500;
win1.height = 500;
win1.show();
}
else {
var isshown = Ext.getCmp('c2').isVisible();
if (isshown == false) {
win1.show();
}
}
}
</script>
</body>
</html>
Test.aspx
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
public class TestFiles
{
private string _strAttachmentFile = string.Empty;
public string AttachmentFile
{
get
{
return this._strAttachmentFile;
}
set
{
this._strAttachmentFile = value;
}
}
public TestFiles(string strPath)
{
this.AttachmentFile = strPath;
}
}
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
Session["AttachFiles"] = null;
this.btn_AttachmentOk.DirectEvents.Click.EventMask.ShowMask = true;
this.btn_AttachmentOk.DirectEvents.Click.EventMask.Msg = "Processing ...";
}
}
protected void AttachmentOk_Click(object sender, DirectEventArgs e)
{
string strFileName = this.inputFile.PostedFile.FileName.Substring(this.inputFile.PostedFile.FileName.LastIndexOf("\\") + 1);
string strPath = Server.MapPath("~") + "\\documents\\" + strFileName;
this.inputFile.PostedFile.SaveAs(strPath);
this.hidAttachSuccess.Text = "true";
List<TestFiles> lstFiles = new List<TestFiles>();
if (Session["AttachFiles"] != null)
{
lstFiles = (List<TestFiles>)Session["AttachFiles"];
}
lstFiles.Add(new TestFiles(strPath));
Session["AttachFiles"] = lstFiles;
storeAttachment.DataSource = lstFiles;
storeAttachment.DataBind();
}
protected void AttachmentCancel_Click(object sender, DirectEventArgs e)
{
this.txt_sub.Text = string.Empty;
this.hidAttachSuccess.Text = "true";
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>FormPanel - Ext.NET Examples</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Store ID="storeAttachment" runat="server">
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="AttachmentFile">
</ext:RecordField>
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:Panel ID="Panel1" runat="server" Width="750" Height="550">
<Content>
<table width="750px">
<tr>
<td>
<ext:Button ID="btnAttachwindow" runat="server" Text="Attachment">
<Listeners>
<Click Handler="#{WindowAttachment}.show();" />
</Listeners>
</ext:Button>
</td>
</tr>
<tr>
<td>
<ext:TabPanel ID="TabPanel1" runat="server">
<Items>
<ext:Panel ID="TabAttachment" Title="Attachment">
<Content>
<ext:GridPanel ID="grdPnlAttachment" runat="server" StoreID="storeAttachment" StripeRows="true"
Header="false" Border="false" Height="200" Width="400">
<ColumnModel ID="columnModelAttachment">
<Columns>
<ext:Column DataIndex="AttachmentFile" Width="300px" Header="File">
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
</Content>
</ext:Panel>
</Items>
</ext:TabPanel>
</td>
</tr>
</table>
</Content>
</ext:Panel>
<ext:Window ID="WindowAttachment" runat="server" Width="400px" Height="150px" BodyStyle="background-color: #FFFFFF;"
Hidden="true" Resizable="false" Modal="true" Title="File Upload">
<Content>
<table border="0" cellpadding="0" cellspacing="3" width="100%">
<tr>
<td style="width: 20%">
<ext:Label ID="lbl_docsub" Text="Subject" runat="server">
</ext:Label>
</td>
<td style="width: 80%">
<ext:TextField ID="txt_sub" Width="220" AllowBlank="false" Cls="manitatory" runat="server"
MaskRe="[^*%<>_.]">
</ext:TextField>
</td>
</tr>
<tr>
<td>
<ext:Label ID="lbl_filepath" Text="File" runat="server">
</ext:Label>
<ext:TextField ID="hidAttachSuccess" Width="162" runat="server" Hidden="true">
</ext:TextField>
<ext:TextField ID="hidAttachFailure" Width="162" runat="server" Hidden="true">
</ext:TextField>
</td>
<td>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<div id="uploadFile_div">
<input type="file" id="inputFile" name="inputFile" style="width: 220px;" class="manitatory"
runat="server" />
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<br />
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="right">
<table>
<tr>
<td>
<ext:Button ID="btn_AttachmentOk" runat="server" Text="Ok" MinWidth="70px" IconCls="ok1">
<DirectEvents>
<Click Delay="1" OnEvent="AttachmentOk_Click" ShowWarningOnFailure="false" Timeout="120000"
Success="if (#{hidAttachSuccess}.getValue()=='true'){ #{WindowAttachment}.hide()}">
</Click>
</DirectEvents>
</ext:Button>
</td>
<td>
<ext:Button ID="btn_AttachmentCancel" runat="server" Text="Cancel" IconCls="cancel"
MinWidth="70px">
<DirectEvents>
<Click Delay="1" OnEvent="AttachmentCancel_Click" ShowWarningOnFailure="false" Timeout="120000"
Success="if (#{hidAttachSuccess}.getValue()=='true'){ #{WindowAttachment}.hide()}">
</Click>
</DirectEvents>
</ext:Button>
</td>
</tr>
</table>
</td>
</tr>
</table>
</Content>
</ext:Window>
</form>
</body>
</html>
Last edited by Daniil; Aug 02, 2011 at 2:55 PM.
Reason: [CLOSED]