[CLOSED] Browser Progress Bar is still in process...

  1. #1

    [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

    Click image for larger version. 

Name:	error.png 
Views:	163 
Size:	27.4 KB 
ID:	3015

    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 1:55 PM. Reason: [CLOSED]
  2. #2
    Hi,

    It's rather IE bug.

    Is the issue reproducible under another browsers, for example, FF or Chrome?
  3. #3
    We don't manage that progress bar (it is impossible)
    ProgressBar is shown when the browser requests remote resource (file (image, script and etc))
    ProgressBar is displayed while the resource is requested
    Use Fiddler to investigate which resource is requested so long
  4. #4

    Browser Progress Bar is still in process...

    Hi Daniil/Vladimir:

    I hope i have not clearly explained you about the issue.

    when I run the page with the following 2 lines i get the Progress bar Issue,
    but when i run the same page after removing this 2 lines, i dont get issue (Browser progress bar issue).

    kindly execute the page and Test it by yourself.

    I had tried to identify with Fiddler, but no clue. I hope that Coolite Event Mask code has some issue.

    
    this.btn_AttachmentOk.DirectEvents.Click.EventMask.ShowMask = true; 
    this.btn_AttachmentOk.DirectEvents.Click.EventMask.Msg = "Processing ...";
  5. #5
    On my side issue is not reproducible.
    As I mentioned before, we don't manage that progress bar (browser doesn't provide such ability), only browser shows/hides that bar
    Even if issue is reproducible on your side than it is IE bug (not Ext.Net) because that bar is out document context

Similar Threads

  1. Replies: 1
    Last Post: Aug 12, 2011, 1:35 PM
  2. Replies: 1
    Last Post: Jul 15, 2011, 6:21 AM
  3. Replies: 0
    Last Post: Jan 04, 2011, 3:16 PM
  4. [CLOSED] Browser progress bar issue
    By speedstepmem3 in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 19, 2010, 10:09 AM
  5. [CLOSED] Update textfield value on a long running process
    By Hari_CSC in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 18, 2010, 11:30 AM

Tags for this Thread

Posting Permissions