After upload file and posting values from formpanel to gridpanel, store save but cannot insert to database by SQLDatasource

  1. #1

    After upload file and posting values from formpanel to gridpanel, store save but cannot insert to database by SQLDatasource

    Hi support,

    I tried to search the examples and also the questions from this forum but no exact solution so i raised my problem below.

    I need upload a file to server and then save the file related info to database including the uploaded filename by formpanel(F3) and then list to gridpanel(G3) using store and SQLDatasource, the upload process is successful but the data insert to grid and but cannot save to database, even i did the store.save() and then store.reload(), but still not work.

    Also, another problem i faced is how to use another formpanel (F1) field value (in the same ASPX) to pass to a window field when i click the document upload button to open the window (can be client side)? Currently i only used another gridpanel (G1) selected value to pass to this document upload window formpanel (F1).

    Since my page is too long so i break down into pieces, below is the simplified code that I run, not sure if it is applicable to illustrate my issue.

    Codebehind code
       protected void Store3_BeforeRecordInserted(object sender, BeforeRecordInsertedEventArgs e)
        {
            object waybillnumber = e.NewValues["S_WayBill_Number"];
    
            if (waybillnumber == null || waybillnumber.ToString() == "")
            {
                e.Cancel = true;
                this.cancel = true;
                this.message = "The Waybill Number could not be blank";
            }
        }
    
        protected void Store3_AfterRecordInserted(object sender, AfterRecordInsertedEventArgs e)
        {
            if (insertedValue.HasValue)
            {
                e.Keys.Add("S_Doc_ID", insertedValue.Value);
                insertedValue = null;
            }
        }
    
        protected void SqlDataSource3_Inserted(object sender, SqlDataSourceStatusEventArgs e)
        {
    
            if (e.AffectedRows > 0 && e.Command.Parameters["@newId"].Value != null)
            {
                insertedValue = (int)e.Command.Parameters["@newId"].Value;
    
            }
            else
            {
                insertedValue = null;
            }
        }
    
        protected void Store3_AfterDirectEvent(object sender, AfterDirectEventArgs e)
        {
            if (e.Response.Success)
            {
                // set to .Success to false if we want to return a failure
                e.Response.Success = !cancel;
                e.Response.Message = message;
            }
        }
    
        protected void Store3_BeforeDirectEvent(object sender, BeforeDirectEventArgs e)
        {
            string emulError = e.Parameters["EmulateError"];
    
            if (emulError == "1")
            {
                throw new Exception("Emulating error");
            }
        }

    SQLDataSource code
          <asp:SqlDataSource
                ID="SqlDataSource3"
                runat="server"
                ConnectionString="<%$ ConnectionStrings:eZConnect_DBConnectionString %>"
                SelectCommand="
                SELECT      
                [S_Doc_ID],
          [S_WayBill_Number]
          ,[S_Document_Filename]
          ,[S_Document_Description]
          ,[S_Document_Upload_DT]
          ,[S_Document_Upload_By]
      FROM [eZConnect].[dbo].[Inbound_Shipment_Document]
                 WHERE (S_WayBill_Number = @S_WayBill_Number) order by S_Document_Upload_DT desc "
                InsertCommand="INSERT INTO [Inbound_Shipment_Document] ([S_WayBill_Number]
                ,[S_Document_Filename]
          ,[S_Document_Description]
          ,[S_Document_Upload_DT]
          ,[S_Document_Upload_By]
                ) VALUES (
                @S_WayBill_Number
                ,@S_Document_Filename
                ,@S_Document_Description
                ,getdate(),'system'); SELECT @newId = @@Identity;"
                DeleteCommand="DELETE [Inbound_Shipment_Document] where S_Doc_ID=@S_Doc_ID"
                OnInserted="SqlDataSource3_Inserted"
                >
                  <SelectParameters>
                    <asp:Parameter  DefaultValue="ABCD-1234" Name="S_WayBill_Number"  DbType="String" />
                </SelectParameters>
                <InsertParameters>
                    <asp:Parameter Name="S_WayBill_Number" Type="String" />
                    <asp:Parameter Name="S_Document_Filename" Type="String" />
                    <asp:Parameter Name="S_Document_Description" Type="String" />
                    <asp:Parameter Direction="Output" Name="newId" Type="Int32" />
                </InsertParameters>
                <DeleteParameters>
                    <asp:Parameter Name="S_Doc_ID" Type="Int32" />
                    
                </DeleteParameters>
                </asp:SqlDataSource>


    GridPanel Code (G3)
    <ext:GridPanel 
                                ID="GridPanel3" 
                                ShowWarningOnFailure="true"
                                runat="server"
                                Border="false"
                                AutoScroll="True"
                                >
                               <Store>
                                    <ext:Store 
                                        ID="Store3" runat="server" DataSourceID="SqlDataSource3" 
                                        
                                        ShowWarningOnFailure="true"
                                        OnAfterDirectEvent="Store3_AfterDirectEvent"
                OnBeforeDirectEvent="Store3_BeforeDirectEvent"
                OnBeforeRecordInserted="Store3_BeforeRecordInserted"
                OnAfterRecordInserted="Store3_AfterRecordInserted"
                                       
                OnReadData="Store3_Refresh"
                    >
                                        <Model>
                                             <ext:Model runat="server" IDProperty="S_Doc_ID" name="ShipmentDocument">
                                                <Fields>
                                                    <ext:ModelField Name="S_Doc_ID" />
                                                    <ext:ModelField Name="S_WayBill_Number" />
                                                    <ext:ModelField Name="S_Document_Filename" />
                                                    <ext:ModelField Name="S_Document_Description" />
                                                    <ext:ModelField Name="S_Document_Upload_DT"/>
                                                    <ext:ModelField Name="S_Document_Upload_By"  />
      
                                                </Fields>
                                            </ext:Model>
                                        </Model>
                                        <Parameters>
                                            <ext:StoreParameter
                                                Name="S_WayBill_Number"
                                                Value="#{GridPanel1}.getSelectionModel().hasSelection() ? #{GridPanel1}.getSelectionModel().getSelection()[0].data.S_WayBill_Number : -1"
                                                Mode="Raw"
                                                />
                                        </Parameters>
                                        <Listeners>
                                            <Exception Handler="Ext.Msg.alert('Document - Load failed', operation.getError());" />
                                        </Listeners>
                                    </ext:Store>
                                </Store>
                               <ColumnModel runat="server">
                                    <Columns>
                                        <ext:Column runat="server" DataIndex="S_Doc_ID" Text="Doc ID" Width="100"  />
                                        <ext:Column runat="server" DataIndex="S_WayBill_Number" Text="WayBill Number" Width="200"  />
                                        <ext:Column runat="server" DataIndex="S_Document_Description" Text="Document Description" Width="200"  />
                                        <ext:HyperlinkColumn runat="server" Flex="1" DataIndex="S_Document_Filename" DataIndexHref="S_Document_Filename" Text="Document Filename"  Width="200" HrefPattern="/upload/{href}" />
                                        <ext:Column runat="server" DataIndex="S_Document_Upload_DT" Text="Uploaded DateTime" Width="200" Type="DateTime" Format="yyyy-MM-dd HH:mm:ss"/>
                                        <ext:Column runat="server" DataIndex="S_Document_Upload_By" Text="Uploaded By" Width="110" />
                                        </Columns>
                                </ColumnModel>
                                <SelectionModel>
                                    <ext:RowSelectionModel runat="server" Mode="Single">
                                    <Listeners>
                                        
                                            <Select Handler="#{FormPanel3}.getForm().loadRecord(record); #{btnDeleteUpload}.enable();" />
                                            <Deselect Handler="if (!#{GridPanel3}.hasSelection()) {#{btnDeleteRecord}.disable();}" />
                                        
                                            
                                        </Listeners>
                                    </ext:RowSelectionModel>
                                </SelectionModel>
                            </ext:GridPanel>
                       </Items>
                        <Listeners>
                            <Expand Handler="#{Store3}.reload();" />
                        </Listeners>
                    
                </ext:Panel>
    Currently I used another gridpanel(G1) selected row to pass the whole row value to this window formpanel (F3), because i don't know how to pass a field from another formpanel (F1) to pass to this text value into this popup windows
     <ext:Window 
                ID="UploadWindow" 
                runat="server" 
                Title="Upload Documents"
                Hidden="true"
                Layout="Fit"
                Height="400" 
                Width="400"
            PageX="250"
            PageY="250"
            Icon="Layout"
            Maximize="true"
            >
            <Items>
                <ext:FormPanel
                ID="FormPanel3"
                runat="server"
                Width="500"
                Frame="true"
                MonitorValid="true"
                Title="File Upload Form"
                PaddingSummary="10px 10px 0 10px"
                LabelWidth="50">
                <Defaults>
                    <ext:Parameter Name="anchor" Value="95%" Mode="Value" />
                    <ext:Parameter Name="allowBlank" Value="false" Mode="Raw" />
                    <ext:Parameter Name="msgTarget" Value="side" Mode="Value" />
                </Defaults>
                <Items>
                    
                    <ext:TextField ID="Up_S_WayBill_Number" runat="server" Name="S_WayBill_Number" FieldLabel="Way Bill Number"/>
                    <ext:TextField ID="DocumentDescription" runat="server" Name="S_Document_Description" FieldLabel="Document Description" />
                    <ext:FileUploadField
                        ID="FileUploadField1"
                        runat="server"   
                        ButtonText="Browse Files"
                        Icon="Add"        
                        ButtonOnly="true"
                        AllowBlank="false"
                        
                        DataIndex="S_Document_Filename"
                        
                        >
                        <Listeners>
                            <render Handler="SetMultipleUpload( this, #{UpdateLabel}) ;" />
                            <Change Handler="if(!UpdateUploadInfo(this.button.fileInputEl.dom, #{UpdateLabel})) {this.reset();
                             SetMultipleUpload( this, #{UpdateLabel})}"/>                        
                        </Listeners>               
                        </ext:FileUploadField>
                    <ext:Label ID="UpdateLabel" runat="server"></ext:Label>
                </Items>
                <Listeners>
                    <ValidityChange Handler="#{SaveButton}.setDisabled(!valid);" />
                </Listeners>
                <Buttons>
                    <ext:Button ID="SaveButton" runat="server" Text="Save" Disabled="true">
                        <DirectEvents>
                            <Click
                                OnEvent="UploadClick"
                                Before="if (!#{FormPanel3}.getForm().isValid()) { return false; }
                                    Ext.Msg.wait('Uploading your document...', 'Uploading');"
    
                                Failure="Ext.Msg.show({
                                    title   : 'Error',
                                    msg     : 'Error during uploading',
                                    minWidth: 200,
                                    modal   : true,
                                    icon    : Ext.Msg.ERROR,
                                    buttons : Ext.Msg.OK
                                });"
                                Success="addUpRecord(#{FormPanel3}, #{GridPanel3});#{UploadWindow}.close();#{Store3}.save();" 
                               
                                >
                                 <EventMask ShowMask="true" />
                            </Click>
                        </DirectEvents>
                    </ext:Button>
                    <ext:Button runat="server" Text="Reset">
                        <Listeners>
                            <Click Handler="#{FormPanel3}.getForm().reset(); SetMultipleUpload( #{FileUploadField1}, #{UpdateLabel});#{UpdateLabel}.setText(''); #{DocumentDescription}.setText('')" />
                        </Listeners>
                    </ext:Button>
                </Buttons>
            </ext:FormPanel>
            </Items>
                <Listeners>
            <Hide Handler="#{FormPanel3}.getForm().reset(); SetMultipleUpload( #{FileUploadField1}, #{UpdateLabel});#{UpdateLabel}.setText('');" />
            
        </Listeners>
            </ext:Window>

    The Javascript for handling upload file and also add the formpanel record to grid
                var addUpRecord = function (form, grid) {
                    if (!form.getForm().isValid()) {
                        Ext.net.Notification.show({
                            iconCls: "icon-exclamation",
                            html: "Form value(s) is/are invalid",
                            title: "Error in Upload"
                        });
    
                        return false;
                    }
                    
                    grid.store.insert(0, new ShipmentDocument(form.getForm().getFieldValues()));
                    grid.store.commitChanges(); 
    
                };
    
    		var UpdateUploadInfo = function (el, label) {
    
                    debugger;
                    var ret = true;
    
                    if (Ext.isIE) {
                        return;
                    }
                    var size = 0;
                    var names = '';
                    for (var num1 = 0; num1 < el.files.length; num1++) {
                        var file = el.files[num1];
                        names += file.name + '\r\n';
                        //alert(file.name+" "+file.type+" "+file.size);
                        size += file.size;
                    }
                    var txt = '';
                    var fileSize = Ext.util.Format.fileSize(size);
    
                    if (size > 31457280) {
                        txt = String.format('You are trying to upload {0}. Max. allowed upload size is 30 MB', fileSize);
                        ret = false;
                    } else {
                        txt = String.format('{0} file(s) of total size {1}', el.files.length, fileSize);
                    }
    
                    label.setText(txt);
                    return ret;
                }
    
                var SetMultipleUpload = function (fileupload, label) {
                    fileupload.button.fileInputEl.set({ multiple: true });
     
                    if (Ext.isIE) {
                        label.setText('IE does not support multiple file upload, to use this feature use Firefox or Chrome');
                    }
                }
  2. #2
    Hello @josephmkchan!

    Your example is quite extensive and hard to follow. Would you take your time to review our threads on tips to make posts that can get best help from? Basically it is all about simplifying the test case to a simple case that reproduces the issue you have.

    Often you can reproduce the issue starting from a sample in our examples explorer.

    Here are the threads with tips on asking questions you can effectively get help with:

    - Tips for creating simplified code samples
    - More Information Required
    - Forum Guidelines

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Hi Fabricio,

    I tried to simplfy the code to the upload path, can you try to simulate this error to help me?


    <%@ Page Title="Login" Language="C#" AutoEventWireup="true" CodeBehind="Shipment_List_Tab2.aspx.cs" Inherits="eZConnect.Shipment_List_Tab" %>
    <%@ Import Namespace="System.Threading" %>
    <%@ Import Namespace="System.Collections.Generic" %>
    
    
    <script runat="server">
    
        public class ShipmentDocument
        {
            public int? S_Doc_ID
            {
                get;
                set;
            }
            public string S_WayBill_Number_Doc
            {
                get;
                set;
            }
            public string S_Document_Description
            {
                get;
                set;
            }
            public string S_Document_Filename
            {
                get;
                set;
            }
        }
        
        
         protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
            }
        }
    
        protected void Store3_BeforeRecordInserted(object sender, BeforeRecordInsertedEventArgs e)
        {
            object waybillnumber = e.NewValues["S_WayBill_Number_Para"];
            //Messagebox("waybill" + waybillnumber ); 
    
            if (waybillnumber == null || waybillnumber.ToString() == "")
            {
                e.Cancel = true;
                this.cancel = true;
                this.message = "The Waybill Number could not be blank";
            }
        }
    
        protected void Store3_AfterRecordInserted(object sender, AfterRecordInsertedEventArgs e)
        {
            if (insertedValue.HasValue)
            {
                e.Keys.Add("S_Doc_ID", insertedValue.Value);
                insertedValue = null;
            }
        }
    
        protected void SqlDataSource3_Inserted(object sender, SqlDataSourceStatusEventArgs e)
        {
            if (e.AffectedRows > 0 && e.Command.Parameters["@newId"].Value != null)
            {
                insertedValue = (int)e.Command.Parameters["@newId"].Value;
    
            }
            else
            {
                insertedValue = null;
            }
        }
    
        protected void Store3_AfterDirectEvent(object sender, AfterDirectEventArgs e)
        {
            if (e.Response.Success)
            {
                // set to .Success to false if we want to return a failure
                e.Response.Success = !cancel;
                e.Response.Message = message;
            }
        }
    
        protected void Store3_BeforeDirectEvent(object sender, BeforeDirectEventArgs e)
        {
            string emulError = e.Parameters["EmulateError"];
    
            if (emulError == "1")
            {
                throw new Exception("Emulating error");
            }
        }
    
        protected void Store3_Refresh(object sender, StoreReadDataEventArgs e)
        {
            string refno1 = e.Parameters["S_WayBill_Number_Para"];
    
            this.SqlDataSource3.SelectParameters["S_WayBill_Number_Para"].DefaultValue = refno1 ?? "ABCD-1234";
    
            this.Store3.DataBind();
        }
    
    
    
        protected void UploadClick(object sender, DirectEventArgs e)
        {
            string tpl = "Uploaded file: {0}<br/>Size: {1} bytes";
    
            if (this.FileUploadField1.HasFile)
            {
                X.Msg.Show(new MessageBoxConfig
                {
                    Buttons = MessageBox.Button.OK,
                    Icon = MessageBox.Icon.INFO,
                    Title = "Success",
                    Message = string.Format(tpl, this.FileUploadField1.PostedFile.FileName, this.FileUploadField1.PostedFile.ContentLength)
                });
                this.FileUploadField1.PostedFile.SaveAs(_UploadPath +this.FileUploadField1.PostedFile.FileName);
            }
            else
            {
                X.Msg.Show(new MessageBoxConfig
                {
                    Buttons = MessageBox.Button.OK,
                    Icon = MessageBox.Icon.ERROR,
                    Title = "Fail",
                    Message = "No file uploaded"
                });
    
                
            }
        }
    
        
    </script>
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Shipments</title>
            <script>
    
                var addUpRecord = function (form, grid) {
                    if (!form.getForm().isValid()) {
                        Ext.net.Notification.show({
                            iconCls: "icon-exclamation",
                            html: "Form value(s) is/are invalid",
                            title: "Error in Upload"
                        });
    
                        return false;
                    }
                    else
                    {
                        grid.store.insert(0, new ShipmentDocument(form.getForm().getFieldValues()));
                          grid.store.commitChanges(); 
                        return true;
                    }
                };
    
    
    
                var UpdateUploadInfo = function (el, label) {
    
                    debugger;
                    var ret = true;
    
                    if (Ext.isIE) {
                        return;
                    }
                    var size = 0;
                    var names = '';
                    for (var num1 = 0; num1 < el.files.length; num1++) {
                        var file = el.files[num1];
                        names += file.name + '\r\n';
                        //alert(file.name+" "+file.type+" "+file.size);
                        size += file.size;
                    }
                    var txt = '';
                    var fileSize = Ext.util.Format.fileSize(size);
    
                    if (size > 31457280) {
                        txt = String.format('You are trying to upload {0}. Max. allowed upload size is 30 MB', fileSize);
                        ret = false;
                    } else {
                        txt = String.format('{0} file(s) of total size {1}', el.files.length, fileSize);
                    }
    
                    label.setText(txt);
                    return ret;
                }
    
                var SetMultipleUpload = function (fileupload, label) {
                    fileupload.button.fileInputEl.set({ multiple: true });
                    //fileupload.button.fileInputEl.set({ multiple: 'multiple' });
                    //App.FileUploadField1.button.fileInputEl.SetMultipleUpload;
     
                    if (Ext.isIE) {
                        label.setText('IE does not support multiple file upload, to use this feature use Firefox or Chrome');
                    }
                }
    
    
        </script>
    
    
    
    
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server">
     
            <asp:SqlDataSource
                ID="SqlDataSource3"
                runat="server"
                ConnectionString="<%$ ConnectionStrings:eZConnect_DBConnectionString %>"
                SelectCommand="
                SELECT      
                [S_Doc_ID],
          [S_WayBill_Number] as S_WayBill_Number_Doc
          ,[S_Document_Filename]
          ,[S_Document_Description]
          ,[S_Document_Upload_DT]
          ,[S_Document_Upload_By]
      FROM [eZConnect].[dbo].[Inbound_Shipment_Document]
                 WHERE (S_WayBill_Number = @S_WayBill_Number_Para) order by S_Document_Upload_DT desc "
                InsertCommand="INSERT INTO [Inbound_Shipment_Document] ([S_WayBill_Number]
                ,[S_Document_Filename]
          ,[S_Document_Description]
          ,[S_Document_Upload_DT]
          ,[S_Document_Upload_By]
                ) VALUES (
                @S_WayBill_Number_Doc
                ,@S_Document_Filename
                ,@S_Document_Description
                ,getdate(),'system'); SELECT @newId = @@Identity;"
                DeleteCommand="DELETE [Inbound_Shipment_Document] where S_Doc_ID=@S_Doc_ID"
                OnInserted="SqlDataSource3_Inserted"
                >
                  <SelectParameters>
                    <asp:Parameter  DefaultValue="ABCD-1234" Name="S_WayBill_Number_Para"  DbType="String" />
                </SelectParameters>
                <InsertParameters>
                    <asp:Parameter Name="S_WayBill_Number_Doc" Type="String" />
                    <asp:Parameter Name="S_Document_Filename" Type="String" />
                    <asp:Parameter Name="S_Document_Description" Type="String" />
                    <asp:Parameter Direction="Output" Name="newId" Type="Int32" />
                </InsertParameters>
                <DeleteParameters>
                    <asp:Parameter Name="S_Doc_ID" Type="Int32" />
                    
                </DeleteParameters>
                </asp:SqlDataSource>
    
            <ext:Viewport runat="server" Layout="BorderLayout">
            
            <Items>
    
    
            <%-- Buttom Detail --%>
            <ext:TabPanel runat="server" ID="MiddleTab" Cls="grid-cls" Region="South" Collapsible="true" Collapsed="true" 
                Frame="true" Split="true" Width="800" Height="720" DeferredRender="true" Icon="Magnifier" AutoScroll="True" Title="Shipment Detail Info">
               
                <Items>
            
             <ext:Panel
                        runat="server"
                        ID="ExtPanel"
                        Cls="grid-cls"
                        Title="External"
                        Height="350"
                        BodyPadding="5"
                        Frame="true"
                        Icon="ApplicationViewDetail"
                        AutoScroll="True"
                        
                    >
                 <Items>
                <ext:FormPanel
                    ID="FormPanel1"
                    runat="server"
                    Border="false"
                    DefaultAnchor="100%"
                    BodyPadding="5"
                    AutoScroll="True"
    
                    >
                                    <ext:TextField runat="server" ID="S_WayBill_Number_Ext" Name="S_WayBill_Number" LabelWidth="150" LabelAlign="Right" FieldLabel="* WayBill Number"
                             LabelStyle="font-weight: bold;" AllowBlank="false" ReadOnly="false" >
    
                             </ext:TextField>
    
    
                </ext:FormPanel>
            </Items>  
            
            </ext:Panel> 
            
    
                <ext:Panel ID="ShipDocPanel" runat="server" Title="Shipment Document" Icon="PageAdd" Hidden="false" HideMode="Display">
                    <Buttons>
                        
                        
                        <ext:Button
                runat="server"
                Text="Document Upload"
                Icon="Application"
                
                >
                        <Listeners>
    
                            <Click Handler="App.Up_S_WayBill_Number.setValue(App.S_WayBill_Number_Ext.getValue()); #{UploadWindow}.show(); " />
    
                            
                        </Listeners>
                </ext:Button>
                        <ext:Button
                runat="server"
                Text="Confirm"
                Icon="Application"
                
                >
                             <Listeners>
                                    <Click Handler="#{Store3}.save();" />
                                </Listeners>
                        </ext:Button>
                        <ext:Button
                runat="server"
                Text="Refresh"
                Icon="Application"
                
                >
                             <Listeners>
                                    <Click Handler="#{Store3}.reload({params:{EmulateError: 0}});" />
                                </Listeners>
                </ext:Button>
                         <ext:Button ID="btnDeleteUpload" runat="server" Text="Delete selected document" Icon="Delete" Disabled="true">
                                <Listeners>
                                    
                                    <Click Handler="deleteRows(#{GridPanel3});#{Store3}.save();#{Store3}.reload();" />
    
                                </Listeners>
                            </ext:Button>
                        </Buttons>
    
                        <Items>
                            <ext:GridPanel 
                                ID="GridPanel3" 
                                ShowWarningOnFailure="true"
                                runat="server"
                                Border="false"
                                AutoScroll="True"
                                >
                               <Store>
                                    <ext:Store 
                                        ID="Store3" runat="server" DataSourceID="SqlDataSource3" 
                                        
                                        ShowWarningOnFailure="true"
                                        OnAfterDirectEvent="Store3_AfterDirectEvent"
                OnBeforeDirectEvent="Store3_BeforeDirectEvent"
                OnBeforeRecordInserted="Store3_BeforeRecordInserted"
                OnAfterRecordInserted="Store3_AfterRecordInserted"
                                       
                OnReadData="Store3_Refresh"
                    >
                                        <Model>
                                             <ext:Model runat="server" IDProperty="S_Doc_ID" name="ShipmentDocument">
                                                <Fields>
                                                    <ext:ModelField Name="S_Doc_ID" />
                                                    <ext:ModelField Name="S_WayBill_Number_Doc" />
                                                    <ext:ModelField Name="S_Document_Filename" />
                                                    <ext:ModelField Name="S_Document_Description" />
                                                    <ext:ModelField Name="S_Document_Upload_DT"/>
                                                    <ext:ModelField Name="S_Document_Upload_By"  />
      
                                                </Fields>
                                            </ext:Model>
                                        </Model>
                                        <Parameters>
                                               <ext:StoreParameter
                                                Name="S_WayBill_Number_Para"
                                                Value="#{S_WayBill_Number_Ext}.getValue()"
                                                Mode="Raw"
                                                />
                                        </Parameters>
                                        <Listeners>
                                            <Exception Handler="Ext.Msg.alert('Document - Load failed', operation.getError());" />
                                        </Listeners>
                                    </ext:Store>
                                </Store>
                               <ColumnModel runat="server">
                                    <Columns>
                                        <ext:Column runat="server" DataIndex="S_Doc_ID" Text="Doc ID" Width="100"  />
                                        <ext:Column runat="server" DataIndex="S_WayBill_Number_Doc" Text="WayBill Number" Width="200"  />
                                        <ext:Column runat="server" DataIndex="S_Document_Description" Text="Document Description" Width="200"  />
                                        <ext:HyperlinkColumn runat="server" Flex="1" DataIndex="S_Document_Filename" DataIndexHref="S_Document_Filename" Text="Document Filename"  Width="200" HrefPattern="/upload/{href}" />
                                        <ext:Column runat="server" DataIndex="S_Document_Upload_DT" Text="Uploaded DateTime" Width="200" Type="DateTime" Format="dd-MMM-yyyy HH:mm:ss"/>
                                        <ext:Column runat="server" DataIndex="S_Document_Upload_By" Text="Uploaded By" Width="110" />
                                        </Columns>
                                </ColumnModel>
                                <SelectionModel>
                                    <ext:RowSelectionModel runat="server" Mode="Single"  AllowDeselect="true">
                                    
                                        <Listeners>
                                        
                                            <Select Handler="#{btnDeleteUpload}.enable();" />
                                            <Deselect Handler="#{btnDeleteUpload}.disable();" />
                                        
                                            
                                        </Listeners>
                                    </ext:RowSelectionModel>
                                </SelectionModel>
                            </ext:GridPanel>
                       </Items>
                        <Listeners>
                            <Expand Handler="#{Store3}.reload();" />
                        </Listeners>
                    
                </ext:Panel>
                 
           </Items>
            </ext:TabPanel>
                </Items>
            </ext:Viewport>
    
            <ext:Window 
                ID="UploadWindow" 
                runat="server" 
                Title="Upload Documents"
                Hidden="true"
                Layout="Fit"
                Height="500" 
                Width="500"
            PageX="250"
            PageY="250"
            Icon="Layout"
            Maximize="true"
            >
            <Items>
                <ext:FormPanel
                ID="FormPanel3"
                runat="server"
                Width="500"
                Frame="true"
                MonitorValid="true"
                Title="File Upload Form"
                PaddingSummary="10px 10px 0 10px"
                LabelWidth="50">
                <Defaults>
                    <ext:Parameter Name="anchor" Value="95%" Mode="Value" />
                    <ext:Parameter Name="allowBlank" Value="false" Mode="Raw" />
                    <ext:Parameter Name="msgTarget" Value="side" Mode="Value" />
                </Defaults>
                <Items>
                    
                    <ext:TextField ID="Up_S_WayBill_Number" runat="server" Name="S_WayBill_Number_Doc" FieldLabel="Way Bill Number" ReadOnly="true"/>
                    <ext:TextField ID="DocumentDescription" runat="server" Name="S_Document_Description" FieldLabel="Document Description" />
                    <ext:FileUploadField
                        ID="FileUploadField1"
                        runat="server"   
                        ButtonText="Browse Files"
                        Icon="Add"        
                        FieldLabel="Filename"
                        AllowBlank="false"
                        
                        DataIndex="S_Document_Filename"
                        
                        >
                        <Listeners>
                            <render Handler="SetMultipleUpload( this, #{UpdateLabel}) ;" />
                            <Change Handler="if(!UpdateUploadInfo(this.button.fileInputEl.dom, #{UpdateLabel})) {this.reset();
                             SetMultipleUpload( this, #{UpdateLabel})}"/>                        
                        </Listeners>               
                        </ext:FileUploadField>
                    <ext:Label ID="UpdateLabel" runat="server"></ext:Label>
                </Items>
                <Listeners>
                    <ValidityChange Handler="#{SaveButton}.setDisabled(!valid);" />
                </Listeners>
                <Buttons>
                    <ext:Button ID="SaveButton" runat="server" Text="Save" Disabled="true">
                        <DirectEvents>
                            <Click
                                OnEvent="UploadClick"
                                Before="if (!#{FormPanel3}.getForm().isValid()) { return false; }
                                    Ext.Msg.wait('Uploading your document...', 'Uploading');"
    
                                Failure="Ext.Msg.show({
                                    title   : 'Error',
                                    msg     : 'Error during uploading',
                                    minWidth: 200,
                                    modal   : true,
                                    icon    : Ext.Msg.ERROR,
                                    buttons : Ext.Msg.OK
                                });"
                                Success="addUpRecord(#{FormPanel3}, #{GridPanel3});#{UploadWindow}.close();"> 
                                
                                 <EventMask ShowMask="true" />
                            </Click>
                        </DirectEvents>
                    </ext:Button>
                    <ext:Button runat="server" Text="Reset">
                        <Listeners>
                            <Click Handler="
                                App.Up_S_WayBill_Number.setValue(App.S_WayBill_Number_Ext.getValue());
                                App.DocumentDescription.setValue('');
                                App.FileUploadField1.reset();
                                " />
    
                        </Listeners>
                    </ext:Button>
                </Buttons>
            </ext:FormPanel>
            </Items>
                <Listeners>
            <Hide Handler="#{FormPanel3}.getForm().reset(); SetMultipleUpload( #{FileUploadField1}, #{UpdateLabel});#{UpdateLabel}.setText('');" />
            
        </Listeners>
            </ext:Window>
            
    
        </form>
    </body>
    </html>
    Click image for larger version. 

Name:	2021-01-28_121658.jpg 
Views:	95 
Size:	29.7 KB 
ID:	25498Click image for larger version. 

Name:	2021-01-28_121707.jpg 
Views:	105 
Size:	14.4 KB 
ID:	25499Click image for larger version. 

Name:	2021-01-28_121738.jpg 
Views:	93 
Size:	61.6 KB 
ID:	25500Click image for larger version. 

Name:	2021-01-28_121751.jpg 
Views:	97 
Size:	59.7 KB 
ID:	25501
    Last edited by josephmkchan; Jan 28, 2021 at 6:42 AM.
  4. #4
    Hello @josephmkchan!

    Thanks for the effort in simplifying the test case, it still looks hard to follow. I mean, we simply cannot run it locally as we don't have the database schema you require. And for the context I don't think it would be doable to simply use the public Northwind sample database, as we have in our examples explorer.

    A few questions to, maybe, get a hold on where you are at with the issue.

    1) I notice you do the upload, and then when the grid is refreshed, it is empty. So although the upload is happening, the SQL Database is not being populated with the record saved?

    2) Are you trying to, in the same request, upload the file and update the database? I'm afraid the upload request might need to go in a separate and dedicated request, because it needs special handling. I suggest you assign a random, unique number (a GUID provided from server maybe?), and make the upload in background as soon as the file is selected, then when the record is saved, you use the GUID to discern the file and move it to a permanent storage. "Orphan" GUID files (for when people upload the files but, before saving the record, changes it) would need to be cleaned up eventually. You can use the same upload code behind logic to check for files (say) older than 1 day that weren't referenced and wipe them without compromising too much performance.

    3) Have you tried to simplify your example further and, say, instead of an actual database, "store" the data in a global/static variable (say, List<ShipmentDocument>)? So you can populate it with an initial mock data and check for successful changes in it (it would reset every time you restart the site/debugging session), but you'd have something where you can reproduce the issue and have we effectively reproduce and then give you better pin-pointed answers for.

    Hope this (somehow) helps with your issue!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] File Upload without a FormPanel
    By barnali in forum 3.x Legacy Premium Help
    Replies: 8
    Last Post: Feb 13, 2015, 6:20 AM
  2. Replies: 12
    Last Post: Feb 20, 2012, 1:58 PM
  3. Replies: 4
    Last Post: Oct 07, 2011, 10:49 AM
  4. Replies: 0
    Last Post: Jun 10, 2010, 1:18 AM
  5. Replies: 3
    Last Post: Apr 20, 2010, 5:24 PM

Tags for this Thread

Posting Permissions