[CLOSED] File up load does not work and does not call Action result of relate upload a file

[jesperhp]

here my form from which i get the input fields

<ext:Window runat="server" ID="window_Notes_File" Width="550px" Layout="Form" Title="Note Detail"
    Padding="10" AutoHeight="true" Modal="true" Closable="true" Resizable="false" >
    <Content>


        <ext:FormPanel ID="frm_Note_File" runat="server" FileUpload="true" Layout="FormLayout" Padding="5" Url="/Notes/UploadFile"
            RenderFormElement="true" BodyStyle="background-color:#dfe8f6" MonitorValid="true" BodyBorder="false" >
            <Content>
                <ext:ComboBox Name="noteCategory" ID="cmb_Notes_File_NoteCategory" LabelPad="0" runat="server" FieldLabel="Note Category"
                    Editable="false" AnchorHorizontal="100%" DisplayField="Name" ValueField="Id"
                    EmptyText="Select a Catagory" AllowBlank="false">
                </ext:ComboBox>
                <ext:TextField Name="title" FieldLabel="Note Title" ID="txt_Notes_File_Title" runat="server"
                    AnchorHorizontal="100%" AllowBlank="false">
                </ext:TextField>
                <ext:FileUploadField ID="file" Name="file" runat="server" Icon="Attach" ButtonText="Brows"
                    FieldLabel="Upload File" AnchorHorizontal="100%" AllowBlank="false" />
            </Content>
            <Listeners>
                <ClientValidation Handler="#{btn_Notes_File_Save}.setDisabled(!valid);" />
            </Listeners>
        </ext:FormPanel>
    </Content>
    <Buttons>
        <ext:Button ID="btn_Notes_File_Save" runat="server" Text="Save" Icon="Disk">
            <Listeners>
            <Click Handler="Note.saveFileNote()" />
            </Listeners>
        </ext:Button>
        <ext:Button ID="btn_Notes_File_Cancel" runat="server" Text="Cancel" Icon="Cross">
            <Listeners>
                <Click Handler="#{window_Notes_File}.hide()" />
            </Listeners>
        </ext:Button>
    </Buttons>
</ext:Window>

form here request goes to java script

saveFileNote: function () {


        var frmNote = Ext.getCmp(this.Note_File_Form);
        var params = { IAppTypeItem: this._AppTypeItem, IAppType: this._AppType };
        var url = '/Notes/UploadFile?' + Ext.urlEncode(params);
        Ext.encode(frmNote).getForm().submit({
        url: url,
        method: "POST",
        dataType: 'json',
        success: function () {
        Ext.net.Notification.show({
        iconCls: 'icon-information',
        pinEvent: 'mouseover',
        html: 'saved successfuly',
        title: 'Title'
        });
        Ext.getCmp(Note.Note_File_Window).hide();
        Note.reloadNotes();
        }
        });
    },
reloadNotes: function () {
        if (this.getId() == 0) {
            var panel = Ext.getCmp(Note.getNotePanelID());
            GeneralHelper.updatePanel(panel, '/Notes/Index?IAppTypeItem=' + this.getAppTypeItem() + '&IAppType=' + this.getAppType());
            //Ext.getCmp(Request.Request_Detail_Panel_Notes).fireEvent('activate', Ext.getCmp(Request.Request_Detail_Panel_Notes));
        }
        else {
            Ext.getCmp(this.RequestGridId()).store.reload();
        }
    },

and here is the action result to get upload file

 public void UploadFile(string title, string noteCategory, int IAppTypeItem, int IAppType)
        {   
            string Root = HttpContext.Server.MapPath("..\\NotesFiles");


            JsonResult result = new JsonResult();
            result.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
            int? userId = HelpDeskWebApp.Models.User.getLoggedinUserId();
            if (userId != null)
            {
                lock (NoteId)
                {
                    //Uploaded File Contents
                    HttpPostedFileBase file = (HttpPostedFileBase)Request.Files["file"];                    
                    string fileName = file.FileName;
                    string fileExtention = Path.GetExtension(fileName);


                    //Directories
                    string dirSysTypePath = Root + "\\" + IAppType;
                    string dirSysTypeItemPath = dirSysTypePath + "\\" + IAppTypeItem;


                    //Creating Directories if not exist
                    DirectoryInfo dirInfoSysType = new DirectoryInfo(dirSysTypePath);
                    DirectoryInfo dirInfoSysTypeItem = new DirectoryInfo(dirSysTypeItemPath);
                    if (!dirInfoSysType.Exists)
                    {
                        dirInfoSysType.Create();
                    }
                    if (!dirInfoSysTypeItem.Exists)
                    {
                        dirInfoSysTypeItem.Create();
                    }




                    int noteId = (from note in db.Notes select note.NoteID).DefaultIfEmpty<int>(0).Max() + 1;
                    string filePath = dirSysTypeItemPath + "\\" + noteId.ToString()+"_"+fileName;
                    file.SaveAs(filePath);
                    int iNoteCategory = db.NoteCategories.First<NoteCategory>(nc => nc.Name == noteCategory).NoteCategoryID;
                    Note filenote = new Note()
                    {
                        Name = title,
                        NoteCategoryID = (short)iNoteCategory,
                        CreatedDateTime = DateTime.Now,
                        CreatedBy = (int)userId,
                        Detail = "",
                        AppTypeID = (byte)IAppType,
                        IAppTypeItem = IAppTypeItem,
                        FileUrl = filePath,
                        FileName = file.FileName,
                        NoteTypeID = (int)NoteTypeEnum.File
                    };
                    db.Notes.Add(filenote);
                    db.SaveChanges();
                }
                result.Data = "New Note Added Success Fully";
            }
            else
            {
                result.Data = "Session Timed Out";
            }
        }

please help me to get input fields from form into action method using ext.js
thanks in advance

[Baidaly]

Hello!

Please, don't forget to wrap your code in CODE tag.

About your problem: take a look at the following sample based on example from our trunk (trunk/Ext.Net.Examples.MVC/Areas/Form_FileUploadField/Views/Basic):

Controller:

public class BasicController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public ActionResult UploadClick()
        {
			string tpl = "Uploaded file: {0}<br/>Size: {1} bytes";
        
			if (this.GetCmp<FileUploadField>("FileUploadField1").HasFile)
			{
				X.Msg.Show(new MessageBoxConfig
				{
					Buttons = MessageBox.Button.OK,
					Icon = MessageBox.Icon.INFO,
					Title = "Success",
					Message = string.Format(tpl, this.GetCmp<FileUploadField>("FileUploadField1").PostedFile.FileName, this.GetCmp<FileUploadField>("FileUploadField1").PostedFile.ContentLength)
				});
			}
			else
			{
				X.Msg.Show(new MessageBoxConfig
				{
					Buttons = MessageBox.Button.OK,
					Icon = MessageBox.Icon.ERROR,
					Title = "Fail",
					Message = "No file uploaded"
				});
			}
            return this.Direct();
        }
    }

View Index.cshtml:

<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>