ExtJS4文件上传 - 如何获取我的文件内容而不仅仅是位置

时间:2012-01-09 10:37:27

标签: c# file-upload extjs extjs4

我知道如何创建一个浏览和选择文件的表单,这不是我的问题。我需要的是获取所选文件的内容,将其发送到服务器并进行处理。现在我只能获取文件位置。

我认为如果我在客户端(extjs)获取文件然后将其发送到服务器会更好,但我不知道如何执行此操作。

{
    xtype: 'fileuploadfield',
    hideLabel: true,
    emptyText: 'Select a file to upload...',
    id: 'upfile',
    //name:'file',
    width: 220
},
buttons:
[
    {
        text: 'Upload',
        handler: function () {
            obj.Import(Ext.getCmp('upfile').getValue())
        }
    }
]

Import(...)是我的服务器功能。我需要给它文件不仅是它的路径!!

提前感谢您的时间

2 个答案:

答案 0 :(得分:5)

AFAIK Ext不使用HTML5文件API,因此在JS端获取文件内容并不简单。可能最简单的方法是创建自定义处理程序。例如:

{
    xtype: 'fileuploadfield',
    hideLabel: true,
    emptyText: 'Select a file to upload...',
    id: 'upfile',
    //name:'file',
    width: 220
},
buttons:
[
    {
        text: 'Upload',
        handler: function () {
            var file = Ext.getCmp('upfile').getEl().down('input[type=file]').dom.files[0]; // fibasic is fileuploadfield
            var reader = new FileReader();
            reader.onload = (function(theFile) {
                return function(e) {
                    obj.Import(e.target.result);
                };
            })(file);
            reader.readAsBinaryString(file);
        }
    }
]

答案 1 :(得分:0)

您正在做的事情Ext.getCmp('upfile').getValue()显然是将文件位置传递给Import方法。您如何期待文件内容呢?要上传文件,您需要提交ExtJS表单。你可以这样做:

handler: function() {

        form.submit({
                url: '/Gallery/Upload',
                waitMsg: 'Uploading your file...',
                success: function(form, action) {
                    alert('File form done!');
                }
            });
        }
    }

在服务器端:

   public void ProcessRequest(HttpContext context)
{
    HttpPostedFile fileupload = context.Request.Files["file"];

    // process your fileupload...

    context.Response.ContentType = "text/plain";
    context.Response.Write("Ok");
}

更新:您需要取消注释fileuploadfield的名称属性。