Page 1 of 3 123 LastLast
Results 1 to 10 of 26

Thread: formpanel and file upload

  1. #1
    Ext User salvi's Avatar
    Join Date
    Mar 2007
    Location
    Warsaw, Poland
    Posts
    30
    Vote Rating
    0
      0  

    Default formpanel and file upload

    I'm trying to force my formpanel to upload a file together with the rest of the form data. I'm fighting with this a whole day. I searched the forum and tried lot of code. Still I get $_FILES empty on the server side... Please, help! Here is my code:

    [CODE]
    var zaliczki = new Ext.FormPanel({
    labelAlign: 'top',
    frame: false,
    title: 'Zaliczki',
    bodyStyle:'padding:5px',
    width: 600,
    items: [
    {
    xtype:'tabpanel',
    deferredRender:false,
    enableTabScroll:true,
    id:'taby',
    activeTab: 0,
    defaults:{autoHeight:true, bodyStyle:'padding:10px', autoScroll:true},
    items:[
    {
    title:'Transza 1',
    layout:'form',
    defaultType: 'textfield',
    items: [


    {
    xtype:'tabpanel',
    deferredRender:false,
    enableTabScroll:true,
    id:'taby2',
    activeTab: 0,
    defaults:{autoHeight:true, bodyStyle:'padding:10px', autoScroll:true},
    items:[
    {
    title:'Zaliczka',
    layout:'form',
    defaultType: 'textfield',
    items: [
    {
    fieldLabel: 'Kwota zaliczki (w PLN)',
    name: 'data[{{$smarty.section.dane.index}}][zal_kwota]',
    value: '{{$dane[dane].zal_kwota}}'
    },
    {
    fieldLabel: 'Procent w stosunku do kwoty wsp

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    55
      0  

    Default

    You need to tell the form that it is to upload a file.

    include isUpload: true in the form config object.

  3. #3
    Ext User salvi's Avatar
    Join Date
    Mar 2007
    Location
    Warsaw, Poland
    Posts
    30
    Vote Rating
    0
      0  

    Default

    Thanks Animal! You are great! Now it works! Complete code below.

    But I have one additional question: now I cannot see the request in Firebug. Why?

    [CODE]

    var zaliczki = new Ext.form.FormPanel({
    labelAlign: 'top',
    frame: false,
    title: 'Zaliczki',
    bodyStyle:'padding:5px',
    width: 600,
    fileUpload:true,
    isUpload: true,
    method:'POST',
    enctype:'multipart/form-data',
    items: [
    {
    xtype:'tabpanel',
    deferredRender:false,
    enableTabScroll:true,
    id:'taby',
    activeTab: 0,
    defaults:{autoHeight:true, bodyStyle:'padding:10px', autoScroll:true},
    items:[
    {
    title:'Transza 1',
    layout:'form',
    defaultType: 'textfield',
    items: [


    {
    xtype:'tabpanel',
    deferredRender:false,
    enableTabScroll:true,
    id:'taby2',
    activeTab: 0,
    defaults:{autoHeight:true, bodyStyle:'padding:10px', autoScroll:true},
    items:[
    {
    title:'Zaliczka',
    layout:'form',
    defaultType: 'textfield',
    items: [
    {
    fieldLabel: 'Kwota zaliczki (w PLN)',
    name: 'data[{{$smarty.section.dane.index}}][zal_kwota]',
    value: '{{$dane[dane].zal_kwota}}'
    },
    {
    fieldLabel: 'Procent w stosunku do kwoty wsp

  4. #4
    Ext User Starfall's Avatar
    Join Date
    Jan 2008
    Location
    Moscow, Russian Federation
    Posts
    158
    Vote Rating
    0
      0  

    Default

    File uploading is processed through a hidden iframe. I had no experience with uploading files, but I suspect the request is not shown in firebug because it only shows requests associated with current frame (that is, your page)

  5. #5
    Ext User salvi's Avatar
    Join Date
    Mar 2007
    Location
    Warsaw, Poland
    Posts
    30
    Vote Rating
    0
      0  

    Default

    Yeah, sounds reasonably...
    Animal, what is your opinion?

  6. #6
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    55
      0  

    Default

    That's right. files can only be uploaded by real form submits. An iframe is used. You will not be able to see the submit body in Firebug because it is a mime multipart message.

    If you want to check it out, you'll have to use Fiddler.

  7. #7
    Ext User salvi's Avatar
    Join Date
    Mar 2007
    Location
    Warsaw, Poland
    Posts
    30
    Vote Rating
    0
      0  

  8. #8
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,615
    Vote Rating
    55
      0  

    Default

    Yep.

  9. #9
    Ext User salvi's Avatar
    Join Date
    Mar 2007
    Location
    Warsaw, Poland
    Posts
    30
    Vote Rating
    0
      0  

    Default

    Looks interesting... I will give it a try.
    Thanks a lot for your help!

  10. #10
    aaaee2
    Guest

    Default

    As well as the author of this thread I has lead to solve all the day simple (only not in ExtJS) task: I wish to upload a file! I have tried a lot of code, patches for source/data/Connection.js, have re-read all that have found on the given subject. Please, help me.

    FF-3.0, Ext-2.1.0 (rev 2042).

    A code fragment:
    Code:
        var form = new Ext.form.FormPanel({
            baseCls:'x-plain',
            layout:'absolute',
            url:'import_foo.php',
            fileUpload:true,
            isUpload:true,
            method:'POST',
            enctype:'multipart/form-data',
            items: [{
                x: 0, y: 3,
                xtype: 'label',
                text: 'Foo file:'
            },{
                x: 105, y: 0,
                name: 'foofile',
                xtype: 'textfield',
                inputType: 'file'
            }]
        });
    
        if (!win) {
            win = desktop.createWindow({
                id: 'foobar-win' + barId,
                title: barName + ' - foobar',
                width: 400,
                height: 116,
                iconCls: 'import',
                resizable: false,
                maximizable: false,
                minimizable: false,
                layout: 'fit',
                plain: true,
                bodyStyle: 'padding:10px;',
                buttonAlign: 'center',
                modal: true,
                items: form,
                buttons: [
                    {text: 'Import Foo', handler: function() { form.getForm().submit(); } },
                    {text: 'Cancel', handler: function() { win.close(); } }
                ]
            });
        }
        win.show();
    Result:
    Code:
    Syntax error: [foofile] => Array\n
    ext-all-debug.js (line 6681)
    This error only when "fileUpload:true", otherwise no errors, but $_FILES array in PHP side is still empty.

Page 1 of 3 123 LastLast

Posting Permissions

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