处理 ExtJs“fileuploadfield”在使用 ASP.NET MVC 的服务器上?

发布于 2024-10-27 11:48:42 字数 1531 浏览 1 评论 0原文

我有一个简单的 ExtJs 表单面板,其中包含一个文件上传字段。当我将表单提交到服务器时,所有键值表单值都会发送到服务器,但不会发送到文件上传字段的键值对。 有谁知道这是为什么? (我在下面附加了一些代码片段)

另外我如何处理服务器上的上传。即我想将图像上传到服务器处理它并将其保存在服务器上的某个位置?

public JsonResult SetEmployeeDetails(string firstname, string photopath)
    {
        GetData data = delegate
        {
            return Repo.SetEmployeeDetails(firstname, photopath);
        };
        JsonResultBase jsonResult = GetJsonResult(data);
        JsonResult json = PortalJsonResult(jsonResult, JsonRequestBehavior.AllowGet);
        return json;
    }



xtype: 'form',
title: 'Employee Setup',
items: [{
            fieldLabel: 'Firstname',
            xtype: 'textfield',
            name: 'firstname',
            maxLength: 10,
            allowBlank:false
        },
        {
            xtype: 'fileuploadfield',
            id: 'form-file',
            emptyText: 'Select an image',
            fieldLabel: 'Photo',
            name: 'photopath',
            buttonText: '',
            buttonCfg: {
                iconCls: 'upload-icon'
            }
        }],
buttons: [{
    text: 'Save',
    scope: this,
    handler: function(){
        var form = this.items.items[0].getForm();
        if(form.isValid()){
            form.submit({
                url: 'EmployeeDetails/SetEmployeeDetails',
                waitMsg: 'Saving your details...',
                success: function(fp, o){
                    msg('Success', 'Processed file on the server');
                }
            });
        }
    }
}]

I have a simple ExtJs form panel which contains a fileuploadfield. When I submit the form to the server all the key value form values get sent to the server but not the key value pair for the file upload field.
Does anyone know why this is? (I have attached some code snippets below)

Also how do I handle the upload on the server. i.e. I want to upload an image to the server process it and save it somewhere on the server?

public JsonResult SetEmployeeDetails(string firstname, string photopath)
    {
        GetData data = delegate
        {
            return Repo.SetEmployeeDetails(firstname, photopath);
        };
        JsonResultBase jsonResult = GetJsonResult(data);
        JsonResult json = PortalJsonResult(jsonResult, JsonRequestBehavior.AllowGet);
        return json;
    }



xtype: 'form',
title: 'Employee Setup',
items: [{
            fieldLabel: 'Firstname',
            xtype: 'textfield',
            name: 'firstname',
            maxLength: 10,
            allowBlank:false
        },
        {
            xtype: 'fileuploadfield',
            id: 'form-file',
            emptyText: 'Select an image',
            fieldLabel: 'Photo',
            name: 'photopath',
            buttonText: '',
            buttonCfg: {
                iconCls: 'upload-icon'
            }
        }],
buttons: [{
    text: 'Save',
    scope: this,
    handler: function(){
        var form = this.items.items[0].getForm();
        if(form.isValid()){
            form.submit({
                url: 'EmployeeDetails/SetEmployeeDetails',
                waitMsg: 'Saving your details...',
                success: function(fp, o){
                    msg('Success', 'Processed file on the server');
                }
            });
        }
    }
}]

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

夜巴黎 2024-11-03 11:48:42

您无法获取文件方法参数。因此,您的光路变量通常为空。
要访问上传的文件,您可以执行以下操作:

HttpPostedFileBase postedFile = Request.Files["fileinput"];
if (postedFile != null)
{
   //process the file content using postedFile.InputStream...
}

在 javascript 中,您需要将 fileUpload: true, 添加到表单配置中,以便 ExtJS 知道您正在表单中上传文件。

You cannot get the file method parameters. So, your photopath variable will be usually null.
To access the file uploaded, you can do the following:

HttpPostedFileBase postedFile = Request.Files["fileinput"];
if (postedFile != null)
{
   //process the file content using postedFile.InputStream...
}

And in the javascript you need to add fileUpload: true, to your form config so that ExtJS knows you are uploading a file in the form.

左岸枫 2024-11-03 11:48:42

有类似的问题。发现需要在处理文件上传的页面上将内容类型设置为“text/html”。 :-(

Response.ContentType = "text/html";

如果您阅读 Ext.data.Connection 的文档, 你会看到

浏览器解析服务器响应以创建 IFRAME 文档。如果服务器使用 JSON 发送返回对象,则 Content-Type 标头必须设置为“text/html”,以便告诉浏览器将文本原样插入到文档正文中。

我花了一段时间才找到这个,但当我遇到你的问题时,其他人可能会遇到类似的问题!

希望这能帮助他们!

Had a similar problem. Found out that you need to set the content type to "text/html" on the page that handles the file upload. :-(

Response.ContentType = "text/html";

If you read the documentation for Ext.data.Connection, you will see that

The server response is parsed by the browser to create the document for the IFRAME. If the server is using JSON to send the return object, then the Content-Type header must be set to "text/html" in order to tell the browser to insert the text unchanged into the document body.

Took me a while to find this, but as I came across your question, someone else might do to with a similar problem!

hopefully this will help them!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文