使用 dojo 上传器到 servlet 时出错答案

【问题标题】：Errors using dojo uploader to a servlet使用 dojo 上传器到 servlet 时出错
【发布时间】：2014-06-11 19:22:10
【问题描述】：

我正在尝试上传文件并使用 post 方法将其发送到 java servlet。我的道场是1.8。刚开始使用 javascript，还有很多东西要学习。如果可以的话，请纠正我。所以我有几个未定义的属性：label、UploaderID 和 dojo 源路径，这应该是真的！

   **************** REVISED CODE ***************************

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>dojox.form.Uploader</title>

    <link href="dijit/themes/dijit.css" rel="stylesheet" />
    <link href="dijit/themes/claro/Common.css" rel="stylesheet" />
    <link href="dijit/themes/claro/form/Common.css" rel="stylesheet" />
    <link href="dijit/themes/claro/form/Button.css" rel="stylesheet" />
    <link href="dojox/form/resources/UploaderFileList.css" rel="stylesheet" />

     <script type="text/javascript" 
      src="//ajax.googleapis.com/ajax/libs/dojo/1.8/dojo/dojo.js" 
     data-dojo-config="parseOnLoad: true, async: true, 
                                         isDebug: true, 
                                         packages: [{name: 'dojo', location: '.'},
                                                    {name: 'dijit', location: 
                                                     '/dojo/dijit'},
                                                    {name: 'dojox', location:
                                                       '/dojo/dojox'},
                                                     ]"></script>

    <script> 
      dojo.require("dojo.domReady")
dojo.require("dijit.form.Button");
dojo.require("dijit.Dialog");
dojo.require("dijit.form.TextBox");   
dojo.require("dojox.form.Uploader");
dojo.require("dojox.form.uploader.FileList");
dojo.require("dojo.parser");
});
    </script> 
</head>
<body class="claro">
    <form method="post" action="user" id="myForm" enctype="multipart/form-data" >
        <fieldset style="background-color:lightblue;">

            <h1 id="greeting">User Administration</h1>

    <p>First Name: <input type="text" name="fname" size="20"> 

            LastName: <input type="text" name="lname" size="20"></p>    

            <input class="browseButton" name="uploadedfile" multiple="false"   
            type="file" data-dojo-type="dojox.form.Uploader" label="Select Some File"
           id="uploader" />

           <p><input type="submit" label="Submit" data-dojo-type="dijit.form.Button" />
            </p>

           <div id="files" data-dojo-type="dojox.form.uploader.FileList"
            uploaderId="uploader"></div>
        </fieldset>
    </form>                     
</body>
</html>

【问题讨论】：

感谢 Dimitri，我更正了所有必要的更改。但是，我认为我的问题是我的模块没有被识别。我将 dojo 1.8 的发布版本作为 Eclipse 中的文件系统导入到我的 WebContent 文件中。而不是标签：选择一些文件。我正在浏览。

标签： javascript html servlets dojo uploader

【解决方案1】：

我注意到这里有几个错误：

<script> 中的第一行：

dojo.required("dojo.domready")

dojo.required() 不存在，应该是dojo.require()。

除此之外，dojo.domready 甚至不是一个模块，应该是dojo.domReady

下面的代码是错误的：

function(parser){
    parser.parse();
});

您可能从使用 AMD 的代码示例中复制粘贴它，但是，您不再使用 AMD（而是 dojo.require()），因此此代码甚至无法编译。

但是，您使用的是parseOnLoad 机制，因此实际上您不需要自己解析页面（这甚至会导致错误，因为您要解析两次相同的小部件）。

删除那部分代码，让加载解析机制工作所需要做的就是：

dojo.require("dojo.parser");

这段代码看起来像是一些失败的尝试将 AMD 示例转换为非 AMD 代码，你做错的另一件事是：

dojo.require("dijit.form/Button");

在使用 AMD 之前的代码 (dijit.form.Button) 时，您应该使用点符号。 Dojo 可能会理解这一点，至少在最近的 Dojo 版本中会，但我怀疑这在旧版本的 Dojo 中是否有效。

您正在用换行符分割属性名称，例如：

<input class="browseButton" name="uploadedfile" multiple="false" type="file" data-
    dojo-type="dojox.form.Uploader"
    label="Select Some File" id="uploader" />

属性名称data-dojo-type 应该是1 行，我认为如果将该属性拆分为多行是无效的。

加载页面时解析页面的 Dojo 配置属性是 parseOnLoad（不是 ParseOnLoad）。我不确定 Dojo 是否处理这些属性不区分大小写，但通常 JavaScript 属性是区分大小写的。

但是，您已经在加载 Dojo 的 <script> 标记上使用了 data-dojo-config 属性，因此您实际上甚至不需要它。

如果您修复了所有这些错误，您的脚本应该可以正常工作（无论是否使用 AMD），正如您在这个小提琴中看到的那样：http://jsfiddle.net/e65EY/

【讨论】：

【解决方案2】：

是否正确设置了dojo.js？您如何使用您的应用程序？您是否在您的机器中或使用某个远程服务器下载了 dojo 源文件。您可以使用谷歌 CDN，如下所示。也可以查看here 设置你的道场源。

src="//ajax.googleapis.com/ajax/libs/dojo/1.8/dojo/dojo.js"

除了@Dmitri cmets。
删除下面的行。

<script> dojoConfig ={isDebug:true, ParseOnLoad: true,};</script>

因为您正在通过下一行重新定义 dojoConfig。数据道场配置

<script type="text/javascript" src="dojo/dojo.js" 
        data-dojo-config="async: true,isDebug: true,parseOnLoad: true"></script>

您还可以使用新的 AMD 格式进行 require() 调用，如下所示。

<script type="text/javascript"> 
require([
            "dojo/parser",
            "dijit/form/Button",
            "dijit/Dialog",
            "dijit/form/TextBox",
            "dojox/form/Uploader",
            "dojox/form/uploader/FileList"
            "dojo/domReady!"
], function (parser, Button, Dialog, TextBox, Uploader, FileList ) {
// now parse the page for widgets
            parser.parse();
// Your code will go here
});
</script>

【讨论】：

我将 src 添加到我的 WebContent 文件 (eclipse) 中。不确定它是否正在阅读。这是我的 java servlte 的 index.html，它将读取名称并读取上传的文件。仍然无法识别属性：lable 和 uploaderId