1. #1
    Sencha User
    Join Date
    Mar 2013
    Posts
    3
    Vote Rating
    0
    Kaustav is on a distinguished road

      0  

    Default Unanswered: File Upload from Sencha Touch 2.3 app

    Unanswered: File Upload from Sencha Touch 2.3 app


    Hie i am developing a Simple Sencha App on Sench touch 2..3 version and CMD 4 and in my app i have form which has got different fields including a file upload field where by the data from the field is sent to the server.But i have got a problem when i test the app by native apk in my android phone(API level 16) the file upload field is not working. I search lots of links but couldn't find the solution ...is the file upload is not supported in sencha touch 2.3 native apk?
    I am posting my form.js here

    Form.js


    Code:
    Ext.define('Test.view.Contact',{
               extend: 'Ext.form.Panel',
               xtype: 'contactform',
               
               requires: [
                          'Ext.form.FieldSet',
                          'Ext.field.Email',
                          'Ext.field.File',
                          'Ext.ProgressIndicator',
                          'Ext.device.filesystem.Sencha'
                ],
               
               config:{
                   
                        progress: function(e) {
                            loadingText: "Uploading: {percent}%";
                         },
    
    
                        //Progress can also be a simple callback
                        progress: function(e) {
                            console.log((e.loaded / e.total) * 100);
                         },
                    
                   title: 'Contact',
                   iconCls: 'user',              
                   xhr2: true,
                   progress:true,
                   xtype: 'formpanel',
                   url: 'http://xyz.net/contact-test.php',
                   layout: 'vbox',
                   
                 items: [                    
                            {
                                docked: 'top',
                                xtype: 'titlebar',
                                title: 'Enquiry'
                            },
                         {
                             xtype: 'fieldset',
                             title: 'Contact Us',
                             instructions: '(email is not required)',
                             
                               items: [
                           {
                               xtype: 'textfield',
                               name: 'Name',
                               label: 'Name'
                               },
                            {
                               xtype: 'emailfield',
                               name: 'Email',
                               label: 'Email'
                               },
                               
                            {
                               xtype: 'textareafield',
                                name: 'Message',
                               label: 'Message'
                               },
                            {
                                xtype:"filefield",
                                label: "Select image(s):",
                                name: "photos",
                                accept:"image/jpeg",
                                multiple: true
                            }
                           ] 
                        },
                        {
                            xtype: 'button',
                            text: 'Send',
                            ui: 'confirm',
                            handler: function() {
                                    //Ext.Viewport.add(progressIndicator);
                                  //  var form = Ext.Viewport.down("formpanel");
                                    var input = Ext.Viewport.down("filefield").getComponent().input;
                                    var files = input.dom.files;
                                    for(var i = 0 ; i<files.length ; i++){
                                        var file = files[i];
                                        if(file.size > 2097152) {
                                            Ext.Msg.alert("JPG Must be less then 2MB");
                                            return;
                                        }
                                        
                                    }
    
    
                                    this.up('contactform').submit();
                            }
                        }                    
                        ]
                          
                
                    
               }
    });

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,824
    Answers
    3470
    Vote Rating
    836
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    I actually remember file upload having a bug in it when helping someone else. Will see if I can find the overrides I made to get it working.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Jun 2013
    Posts
    21
    Answers
    1
    Vote Rating
    1
    ksmallik is on a distinguished road

      0  

    Default


    I have the same problem in uploading my files... I hope there will be a post regarding this issue

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,824
    Answers
    3470
    Vote Rating
    836
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The bug I mentioned is TOUCH-5081 and I have a merge request in for Touch 2.3.2 at the moment. You can try this override:

    Code:
    Ext.define('Override.data.Connection', {
        override : 'Ext.data.Connection',
    
        onUploadComplete : function(frame, options, id) {
            // bogus response object
            var response = {
                    responseText : '',
                    responseXML  : null,
                    request      : {
                        options : options
                    }
                },
                doc, body, firstChild;
    
            try {
                doc = (frame.contentWindow && frame.contentWindow.document) || frame.contentDocument || window.frames[id].document;
    
                if (doc) {
                    if (doc.hasOwnProperty('body') && doc.body) {
                        body = doc.body;
                    }
    
                    if (body) {
                        firstChild = body.firstChild || {};
    
                        if (this.textAreaRe.test(firstChild.tagName)) { // json response wrapped in textarea
                            response.responseText = firstChild.value;
                        } else {
                            response.responseText = firstChild.innerHTML;
                        }
    
                        //in IE the document may still have a body even if returns XML.
                        response.responseXML = body.XMLDocument;
                    }
                }
            } catch (e) {
                response.success = false;
                response.message = 'Cross-Domain access is not permitted between frames. XHR2 is recommended for this type of request.';
                response.error = e;
            }
    
            this.onAfterUploadComplete(response, frame, options);
        }
    });
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  5. #5
    Sencha User
    Join Date
    Jun 2013
    Posts
    21
    Answers
    1
    Vote Rating
    1
    ksmallik is on a distinguished road

      0  

    Default


    Thanks for the reply. Just wanted to know which folder in the app I should put the override in. This is the first time I have come up against an override. Is it appname/touch/src ?
    Thanks again...

  6. #6
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,824
    Answers
    3470
    Vote Rating
    836
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      1  

    Default


    You can put it in any directory, just need to tell Ext.Loader where the Override class name will be. So if you put it in /overrides/data/Connection.js then you need to have Ext.Loader.setPath('Override', 'overrides/');

    You also need to tell Cmd (if you are using Cmd) where it is so you can open the .sencha/app/sencha.cfg and add overrides to the app.classpath property.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  7. #7
    Sencha User
    Join Date
    Jun 2013
    Posts
    21
    Answers
    1
    Vote Rating
    1
    ksmallik is on a distinguished road

      0  

    Default


    Hi mitchell ,
    I am trying to write an app to upload multiple files in Sencha Touch 2.3. I am going to use the new XHR2 with progress bar feature. My questions are these...
    1. Is it possible to have a progress bar for each file being uploaded?
    2. If unfeasible, do I need to write a custom component for the progressbar? (I am new to writing custom components :-( ... where do I start?)

    Thanks.

  8. #8
    Sencha User
    Join Date
    Mar 2008
    Location
    Brazil
    Posts
    73
    Vote Rating
    5
    fabio.parra is on a distinguished road

      0  

    Default Firefox document.hasOwnProperty

    Firefox document.hasOwnProperty


    Mitchell, do you know why this check exists?

    Code:
    if (doc.hasOwnProperty('body') && doc.body) {
       body = doc.body;
    }
    In firefox doc.hasOwnProperty('body') returns false.
    https://bugs.webkit.org/show_bug.cgi?id=80060