Question

我正在拼命尝试为我的网站用户启用多属性。用户应该能够将一堆PDF文件上传到我的服务器，而无需单独选择每个文件。我正在使用gwt-upload进行上传。可悲的是

MultiUploader

实际上并不允许用户一次选择多个文件，但您必须再次为每个文件单击“浏览” - 按钮，然后在浏览器中选择。

我研究并意识到我需要这样的东西

<input name='uploads[]' type="file" multiple>

在从gwt-upload创建的输入处设置“multiple”属性，到目前为止，开放文件对话框允许我选择多个文件，但是上传不再开始/工作了。

我找不到任何使用gwt的多文件输入的例子。如果有一种方法可以使用gwt-upload，那将是完美的，因为我真的不想再次实现整个上传逻辑了！

非常感谢！

Answer 1

解决方案非常简单。 gwt-upload有一个类Uploader，可以进行多次上传。在gwt-upload的wiki中建议的servlet代码已经能够处理多个上传。

我不得不改变Uploader类中的某些东西（源代码完全可用，所以我只是复制它并替换了我需要的部分）。要访问所选文件的文件名和文件大小，我创建了一个简单的本机方法：

private static native String getFilesSelected() /*-{
    var count = $wnd.$('input:file')[0].files.length;

    var out = "";

    for (i = 0; i < count; i++) {
        var file = $wnd.$('input:file')[0].files[i];
        out += file.name + ';' + file.size + ";";
    }
    return out;
}-*/;

哪个返回值我分裂;得到所需的结果。

你需要用自定义的文件替换上传者FileInput（setFileInput（）），它会将多重属性设置为输入。我使用这样的包装类：

public class MyFileInput implements IFileInput {

    private final FileUpload fu;

    public MyFileInput() {
        fu = new FileUpload();
        DOM.setElementProperty(fu.getElement(), "multiple", "multiple");    
    }
}

你显然需要实现IFileInput的其他方法，我将它们全部链接到fu。两个没有相同的方法，但我不使用它们，所以这里没问题......

Answer 2

以下是我最终认为适用于所有浏览器的内容：

form = new FormPanel();
form.setEncoding(FormPanel.ENCODING_MULTIPART);
form.setMethod(FormPanel.METHOD_POST);
form.add(new HTML("<input type='file' id='fileselect' name='fileselect[]' multiple />"));

然后在服务器端我只是使用“org.apache.commons.fileupload”的东西。

是的，有些人可能不喜欢表单中的HTML元素，但是如果你想要的话，你可以从中获取输入元素：

protected Element getFileSelectElement() {
    HashMap<String, Element> idMap = Maps.newHashMap();
    GuiUtil.parseIdsToMap(inputField.getElement(), idMap);
    Element input = idMap.get("fileselect");
    return input;
}

public static void parseIdsToMap(Element element, HashMap<String, Element> idMap) {
    int nodeCount = element.getChildCount();
    for (int i = 0; i < nodeCount; i++) {
        Element e = (Element) element.getChild(i);
        if (e.getId() != null) {
            idMap.put(e.getId(), e);
        }
    }
}

最后......如果你想访问用户选择的文件列表，在浏览器端，这就是我所拥有的：

public static native String getFileNames(Element input) /*-{

    var ret = "";

    //microsoft support
    if (typeof (input.files) == 'undefined'
            || typeof (input.files.length) == 'undefined') {
        return input.value;
    }

    for ( var i = 0; i < input.files.length; i++) {
        if (i > 0) {
            ret += ",";
        }
        ret += input.files[i].name;
    }
    return ret;
}-*/;

Answer 3

我使用更简单的解决方案。

defaultUploader = new MultiUploader();
IFileInput ctrl = defaultUploader.getFileInput();
DOM.setElementProperty((ctrl).getElement(), "multiple", "multiple");

使用GWT一次上传多个文件

3 个答案: