用于GWT的Moxieapps文件上传器添加多个上传按钮 [英] Moxieapps file uploader for GWT adding multiple upload buttons

问题描述

我正在构建的GWT网络应用程序有一个页面，用户可以上传CSV文件。上传代码使用

在检查器中查看生成的HTML的相关部分，显示输入和 div 包含按钮被反复添加（尽管只有一个dropzone）：



我已经多次检查了我的代码，看看我是否在做可能导致这种情况的事情，但没有发现任何东西。您实际上并没有手动添加按钮或输入;这是由框架自动完成的。 fileUploader 只被初始化一次（这是GWT客户端代码，我已经使用检查器进行了调试以及将日志语句记录到控制台以确认这一点）：

  fileUploader.setButtonDisabled（真）.setFileTypes（ *。CSV）
 .setUploadURL（getBaseUrl（）+/文件上传。上传 ）
 .setButtonText（ <跨度类= \ buttonText\ >选择CSV文件上传< /跨度>中）
 .setFileSizeLimit（FILE_SIZE_LIMIT）
。 setButtonCursor（CustomUploader.Cursor.HAND）
 .setButtonAction（CustomUploader.ButtonAction.SELECT_FILE）
 .setUploadProgressHandler（新UploadProgressHandler（）{...}）
 .setUploadSuccessHandler（...）
 //等等与其他处理程序
  

方法 setButtonText 是从其他几个地方调用的，而且文本是按照它应该改变的，但只在最后一个按钮上（如果有的话）。否则，我的代码中没有什么可以添加按钮，据我所知。

其他人遇到过这个问题吗？我需要设置一些属性来防止这种情况吗？难道这是一个在moxieapps代码中的错误吗？

解决方案

写出我的问题后， moxieapps代码？最后，我跟进了这个怀疑，事实证明这确实是 org.moxieapps.gwt.uploader.client.Uploader 类中的一个错误。 / p>
$ b $ < input 和select file按钮添加到 onLoad（） / code>该方法没有检查他们是否已经被添加。



它看起来像这个框架没有任何积极的发展一段时间，所以我认为是时候自定义覆盖版本。我测试了这个，它的工作原理：

  package yourpackagename.client.override; 
 
 import java.util.Iterator; 
 
导入org.moxieapps.gwt.uploader.client.Uploader; 
 
 import com.google.gwt.user.client.ui.FileUpload; 
 import com.google.gwt.user.client.ui.Widget; 
 import com.google.gwt.user.client.ui.WidgetCollection; 
 $ b $ / ** 
 *这个类存在的唯一原因是修复moxieapps上传器
 *（org.moxieapps.gwt.uploader-1.1.0.jar ）每次在< code> onLoad（）< / code>时添加一个新的上传输入和
 *方法被调用，即每次
 *你都离开页面，然后返回到它。 
 * / 
 public class CustomUploader extends Uploader {
 @Override 
 protected void onLoad（）{
 boolean hasFileUploadAlready = false; 
 WidgetCollection children = getChildren（）; 
 for（Iterator< Widget> iterator = children.iterator（）; iterator.hasNext（）;）{
 Widget eachWidget = iterator.next（）; 
 if（eachWidget instanceof FileUpload）{
 hasFileUploadAlready = true; 
 
 
 //如果没有文件上传输入和按钮
，只调用super方法if（！hasFileUploadAlready）{
 super.onLoad （）; 
 
 
 
 
 
而不是引用 org.moxieapps.gwt.uploader.client.Uploader ，我改变了引用来指向我的自定义上传类，它现在将检查现有的 FileUpload 子部件，如果找到这样的部件，只需跳过原始的 onLoad（）代码即可。
 $ b 
可能是一个撬棍的方法，但它的作品（在我的情况下，更改Maven管理的JAR文件不是很实际）。希望这会对遇到这个问题的其他人有用。
 
The GWT web app I'm building has a page where users can upload CSV files. The upload code uses the Moxieapps GWT Uploader, which mostly works great.

However, I've discovered a strange scenario, where navigating away from the page and back to it adds the upload button again. So the third time I visit the page, the upload section will look like this:



And the relevant part of the generated HTML viewed in an inspector shows that both the input and the div containing the "button" get added over and over (though there is only ever one dropzone):



I've gone over my code many times to see whether I was doing something that could be causing this, but haven't found anything. You don't actually manually add the button or the input; this is done automatically by the framework. The fileUploader gets initialised only once (this being GWT client code, I've debugged using the inspector as well as logging statements to the console to confirm this):
fileUploader.setButtonDisabled(true).setFileTypes("*.csv")
    .setUploadURL(getBaseUrl() + "/fileUpload.upload")
    .setButtonText("<span class=\"buttonText\">Select CSV file to upload</span>")
    .setFileSizeLimit(FILE_SIZE_LIMIT)
    .setButtonCursor(CustomUploader.Cursor.HAND)
    .setButtonAction(CustomUploader.ButtonAction.SELECT_FILE)
    .setUploadProgressHandler(new UploadProgressHandler() {...})
    .setUploadSuccessHandler(...)
    // etc. with other handlers
The method setButtonText() is called from a couple of other places, and the text changes as it should, but only on the last button (if there are several). Otherwise, there's nothing in my code that could possibly be adding the button as far as I can tell.

Has anyone else encountered this issue? Is there some property I need to set to prevent this? Could it be a bug in the moxieapps code?
解决方案
After writing out my question, and adding "Could it be a bug in the moxieapps code?" at the end, I followed up on that suspicion, and it turns out that it is indeed a bug in the org.moxieapps.gwt.uploader.client.Uploader class.

The input and the "select file" button are added in the onLoad() method of that class without a check whether they may have been added already.

It looks like there hasn't been any active development on this framework for some time, so I thought it was time for a custom override version. I've tested this and it works:
package yourpackagename.client.override;

import java.util.Iterator;

import org.moxieapps.gwt.uploader.client.Uploader;

import com.google.gwt.user.client.ui.FileUpload;
import com.google.gwt.user.client.ui.Widget;
import com.google.gwt.user.client.ui.WidgetCollection;

/**
 * The sole reason this class exists is to fix a bug in the moxieapps uploader
 * (org.moxieapps.gwt.uploader-1.1.0.jar) where it adds a new upload input and
 * button each time its <code>onLoad()</code> method is called, i.e. every time
 * you navigate away from the page and then back to it.
 */
public class CustomUploader extends Uploader {
    @Override
    protected void onLoad() {
        boolean hasFileUploadAlready = false;
        WidgetCollection children = getChildren();
        for (Iterator<Widget> iterator = children.iterator(); iterator.hasNext();) {
            Widget eachWidget = iterator.next();
            if (eachWidget instanceof FileUpload) {
                hasFileUploadAlready = true;
            }
        }
        // Only call the super method if there isn't already a file upload input and button
        if (!hasFileUploadAlready) {
            super.onLoad();
        }
    }
}
Instead of referencing the org.moxieapps.gwt.uploader.client.Uploader, I've changed the references to point to my custom uploader class, which will now check for an existing FileUpload child widget, and simply skip the original onLoad() code if it finds such a widget.

Might be a bit of a crowbar approach, but it works (and in my case, changing the maven-managed JAR file is not very practical). Hopefully, this will be useful to anyone else coming across this problem.

                        
这篇关于用于GWT的Moxieapps文件上传器添加多个上传按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！