Uploading file using MVC

[ingbabic]

Hello
I am trying to upload a file. The form which I am using is a partial view. Here is the code:

<form id="uploadForm" enctype="multipart/form-data">
@(
    Html.X().Window()
    .Title("Upload an image")
    .Width(600)
    .Closable(true)
    .Resizable(false)
    .Items(
            Html.X().FormPanel().ID("uploadFormPanel").Frame(true).Width(600).Padding(10)
            .Items(
                Html.X().FileUploadField().ID("FileUploadField1").EmptyText("Select a file").FieldLabel("File:").ButtonText("Browse").Icon(Icon.PageWhitePut).LabelWidth(30).InputWidth(520).AllowBlank(false)
            )
            .Listeners(l => l.ValidityChange.Handler = "#{okButton}.setDisabled(!valid);")
    )
    .Buttons(
        Html.X().Button()
        .Text("Ok")
        .ID("okButton")
        .Icon(Icon.Disk)
        .Disabled(true)
        .DirectEvents(de =>
        {
            de.Click.Url = Url.Action("UploadClick");
            de.Click.IsUpload = true;
            de.Click.FormID = "uploadForm";
            de.Click.Before = @"
                if (!#{uploadFormPanel}.getForm().isValid()) {
                    return false;
                }
                Ext.Msg.wait('Uploading your photo...', 'Uploading');";
            de.Click.Failure = @"
                Ext.Msg.show({
                title   : 'Error',
                msg     : 'Error during uploading',
                minWidth: 200,
                modal   : true,
                icon    : Ext.Msg.ERROR,
                buttons : Ext.Msg.OK
            });";
        })
        ,
        Html.X().Button()
        .Text("Cancel")
        .OnClientClick("this.up('window').close();")
    )
    .DefaultButton("okButton")
)
</form>

Code is actually taken from sample application, I have just added a window (I need to have a modal form for uploading a file). The problem is that HasFile property of FileUploadField is allways returning false. What should I do?

[ingbabic]

Hmm I discovered one interesting fact. If I use plain FormPanel (without a window), everything works, but as soon as I put a FormPanel in a Window file upload does not work. Please try it yourself. This is the code (from samples) which works:

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_BaseLayout.cshtml";
    var X = Html.X();
}

<h2>Index</h2>

@section example
{
<form id="fileUpload" enctype="multipart/form-data">
       X.FormPanel()
            .ID("BasicForm")
            .Width(500)
            .Frame(true)
            //.Title("File Upload Form")
            .PaddingSpec("10px 10px 0 10px")
            .FieldDefaults(fd => fd.LabelWidth = 50)
            .Defaults(d =>
            {
                d.Add(new Parameter("anchor", "95%", ParameterMode.Value));
                d.Add(new Parameter("allowBlank", "false", ParameterMode.Raw));
                d.Add(new Parameter("msgTarget", "side", ParameterMode.Value));
            })
            .Items(
                X.TextField()
                    .ID("PhotoName")
                    .FieldLabel("Name"),

                X.FileUploadField()
                    .ID("FileUploadField1")
                    .EmptyText("Select an image")
                    .FieldLabel("Photo")
                    .ButtonText("")
                    .Icon(Icon.ImageAdd)
            )
            .Listeners(l => l.ValidityChange.Handler = "#{SaveButton}.setDisabled(!valid);")
            .Buttons(
                X.Button()
                    .ID("SaveButton")
                    .Text("Save")
                    .Disabled(true)
                    .DirectEvents(de =>
                    {
                        de.Click.Url = Url.Action("UploadClick");
                        de.Click.FormID = "fileUpload";
                        de.Click.Before = @"if (!#{BasicForm}.getForm().isValid()) { return false; }
                            Ext.Msg.wait('Uploading your photo...', 'Uploading');";
                        de.Click.Failure = @"Ext.Msg.show({
                                title   : 'Error',
                                msg     : 'Error during uploading',
                                minWidth: 200,
                                modal   : true,
                                icon    : Ext.Msg.ERROR,
                                buttons : Ext.Msg.OK
                            });";
                    }),

                X.Button()
                    .Text("Reset")
                    .OnClientClick("#{BasicForm}.getForm().reset();")
            )
    )
    </form>
}

But if you just surround a FormPanel in a Window like this:

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_BaseLayout.cshtml";
    var X = Html.X();
}

<h2>Index</h2>

@section example
{
<form id="fileUpload" enctype="multipart/form-data">
    @(Html.X().Window()
    .Title("Upload an image")
    .Width(500)
    .Closable(true)
    .Resizable(false)
    .Items(
            X.FormPanel()
            .ID("BasicForm")
            .Width(500)
            .Frame(true)
            //.Title("File Upload Form")
            .PaddingSpec("10px 10px 0 10px")
            .FieldDefaults(fd => fd.LabelWidth = 50)
            .Defaults(d =>
            {
                d.Add(new Parameter("anchor", "95%", ParameterMode.Value));
                d.Add(new Parameter("allowBlank", "false", ParameterMode.Raw));
                d.Add(new Parameter("msgTarget", "side", ParameterMode.Value));
            })
            .Items(
                X.TextField()
                    .ID("PhotoName")
                    .FieldLabel("Name"),

                X.FileUploadField()
                    .ID("FileUploadField1")
                    .EmptyText("Select an image")
                    .FieldLabel("Photo")
                    .ButtonText("")
                    .Icon(Icon.ImageAdd)
            )
            .Listeners(l => l.ValidityChange.Handler = "#{SaveButton}.setDisabled(!valid);")
            .Buttons(
                X.Button()
                    .ID("SaveButton")
                    .Text("Save")
                    .Disabled(true)
                    .DirectEvents(de =>
                    {
                        de.Click.Url = Url.Action("UploadClick");
                        de.Click.FormID = "fileUpload";
                        de.Click.Before = @"if (!#{BasicForm}.getForm().isValid()) { return false; }
                            Ext.Msg.wait('Uploading your photo...', 'Uploading');";
                        de.Click.Failure = @"Ext.Msg.show({
                                title   : 'Error',
                                msg     : 'Error during uploading',
                                minWidth: 200,
                                modal   : true,
                                icon    : Ext.Msg.ERROR,
                                buttons : Ext.Msg.OK
                            });";
                    }),

                X.Button()
                    .Text("Reset")
                    .OnClientClick("#{BasicForm}.getForm().reset();")
            )
       )
    )
    </form>
}

then whole sample does not work. I need this to be in a window (due to my apps design). What should I do?