[CLOSED] MVC upload file in FormPanel

[mattwoberts]

Hi,

I'm trying to upload a file using the FileUploadField in a FormPanel in my MVC app - can anyone suggest how this can be done. I'm not aware of it being possible to upload a file (form with enctype of multipart/form-data) via an AJAX request... Does Ext.NET / ExtJS handle this?

My markup currently looks like this:

                                    <ext:FormPanel ID="UploadForm" runat="server" Border="false" Url="/LocationData/UploadMap/">
                                    <Items>
                                        <ext:FileUploadField ID="MapUpload" runat="server" Width="300" Icon="Attach" FieldLabel="File"/>
                                        <ext:Button ID="Button3" runat="server" Text="Upload map">
                                            <Listeners>
                                                <Click Handler="#{UploadForm}.form.submit({ waitMsg : 'Uploading...', params : { id : getRecordId() }, success : uploadMapCompleted, failure : uploadFailureHandler});" />
                                            </Listeners>
                                        </ext:Button>
                                    </Items>
                                    </ext:FormPanel>

[Vladimir]

Hi,

Please set IsUpload="true" for FormPanel

[mattwoberts]

Hi,

Sorry, no such property exists

[Daniil]

Hi,

I think Vladimir meant FileUpload="true".

[mattwoberts]

I added that property, and now when I submit the form I get a JavaScript error from the Ext.Net generated Javascript....

The error from WebResource.axd:

Uncaught SyntaxError: Unexpected token <

My form looks like this:

<ext:FormPanel ID="UploadForm" runat="server" Border="false" Url="/LocationData/UploadMap/" FileUpload="true">
<Items>
    <ext:FileUploadField ID="MapUpload" runat="server" Width="300" Icon="Attach" FieldLabel="File"/>
    <ext:Button ID="Button3" runat="server" Text="Upload image">
        <Listeners>
            <Click Handler="#{UploadForm}.form.submit({ waitMsg : 'Uploading...', params : { id : getRecordId() }, success : uploadMapCompleted, failure : uploadFailureHandler});" />
        </Listeners>
    </ext:Button>
</Items>
</ext:FormPanel>

[Vladimir]

Hi,

If you use native FormPanel submit method with file uploading then controller action should return something similar

public ContentResult UploadMap()
{
     return Content("<textarea>{success: true}</textarea>");
}

Wraping by textarea tags is required when you upload file, in other cases textarea tags must be excluded

[mattwoberts]

Thanks, that sorted it

[vs.mukesh]

Hi,

If you use native FormPanel submit method with file uploading then controller action should return something similar

public ContentResult UploadMap()
{
     return Content("<textarea>{success: true}</textarea>");
}

Wraping by textarea tags is required when you upload file, in other cases textarea tags must be excluded

Hi

Great Post! really it works.. thanks a lot...