Results 1 to 2 of 2

Thread: Using kostysh/File-uploading-component-for-Sencha-Touch in Architect

  1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    7
    Vote Rating
    1
      0  

    Default Using kostysh/File-uploading-component-for-Sencha-Touch in Architect

    Hi Everybody,
    I have tried to use the component kostysh/File-uploading-component-for-Sencha-Touch (you can download it from github) inside an Architect app.
    The first trial has been to import the resource Fileup.js and hack the code to insert the related item into a form:
    Code:
    {
            id: 'fileBtn',
            xtype: 'fileupload',
            iconCls: 'download',
            iconMask: true,
            text: 'File dialog',
            padding: 20,
            actionUrl: 'resources/php/getfile.php',// Url of getfile.php
            returnBase64Data: true,
    		returnUrl: true,
    		autoUpload: false
    }
    This works and I can get the file uploaded, but it's not really the best solution, since I must every time manually change the code before running it, since I cannot insert such component directly in Architect.

    The second trial has been to create a component inside Architect and place it in the toolbox. Enclosed the related file. The problem here is that I don't find a way to set the template of the element, which breaks of course all the code:
    Code:
    template: [
            
            // Default button elements (do not change!)
            {
                tag: 'span',
                reference: 'badgeElement',
                hidden: true
            },
            {
                tag: 'span',
                className: Ext.baseCSSPrefix + 'button-icon',
                reference: 'iconElement',
                hidden: true
            },
            {
                tag: 'span',
                reference: 'textElement',
                hidden: true
            },
            
            // Custom inline elements
            {
                tag: 'iframe',
                reference: 'iframeElement',
                height: 0,
                width: 0,
                frameborder: 0,
                name: 'fileUploadIframe',
                loading: 0
            },
            {
                tag: 'form',
                reference: 'formElement',
                target: 'fileUploadIframe',
                method: 'post',
                enctype: 'multipart/form-data',
                action: null,
                hidden: false,            
                
                children: [
                    {
                        tag: 'input',
                        reference: 'base64CommandElement',
                        type: 'hidden',
                        name: 'base64',
                        value: false,
                        tabindex: -1
                    },
                    {
                        tag: 'input',
                        reference: 'urlCommandElement',
                        type: 'hidden',
                        name: 'url',
                        value: false,
                        tabindex: -1
                    },
                    {
                        tag: 'input',
                        reference: 'fileElement',
                        type: 'file',
                        name: 'userfile',
                        tabindex: -1,
                        hidden: false,
                        style: 'opacity:0;position:absolute;height:100%;width:100%;left:0px;top:0px;'
                    }
                ]
            }
        ],
    Any suggestion?
    Thanks
    Luca
    Attached Files Attached Files

  2. #2
    Sencha User
    Join Date
    Jul 2012
    Posts
    7
    Vote Rating
    1
      0  

    Default

    For those of you interested the solution for me has been to include the Fileup.js in the resources and add programmatically the xtype: 'fileupload' when initialising the form:

    Code:
    onAddMediaFormInitialize: function(component, options) {
            var mediaFile = component.child('#mediaFileData');
            mediaFile.add({
                xtype: 'fileupload',
                actionUrl: 'getfile.php',
                returnBase64Data: false,
                returnUrl: false,
                autoUpload: false,
                hidden: true,
                id: 'fileBtn',
                ui: 'action',
                iconCls: 'download',
                iconMask: true,
                text: 'File dialog'
            });
        }
    Bye,
    Luca

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •