尝试制作一个将创建表单的 dojo 小部件

Question

我想这样做，以便在我为上传小部件放置 data-dojo-type="js/widget/SAUploadForm" 的地方生成一个表单。不确定我现在错在哪里，因为页面上没有生成任何表格。

<html>
<head>
<title>Upload</title>
<script>
    dojoConfig = {
        async : true,
        parseOnLoad : false
    }
</script>
<script src="js/dojo/dojo.js"></script>
</head>
<body>
<div>
    <h1 align="center">Upload</h1>
    <br />
    <div data-dojo-type="js/widget/SAUploadForm"></div>
</div>
</body>
</html>

我的插件文件：SAUploadForm.js

define(["dojo/_base/declare", "dojo/dom-construct", "dojo/parser", "dijit/_WidgetBase", "dijit/_TemplatedMixin"],
    function(declare, domConstruct, parser, ready, _WidgetBase, _TemplatedMixin) {
        decalre("SAUploadForm", [_WidgetBase, _TemplatedMixin], {
            formString: '<form method="post" enctype="multipart/form-data" action="/webapp/upload">' +
            '<table>' + 
                '<tr>' + 
                    '<td>File:</td>' + 
                    '<td><input type="file" name="file" value="Browse" accept=".sub" /></td>' + 
                '</tr><tr>' + 
                    '<td colspan="2"><button type="submit">Upload</button></td>' + 
                '</tr>' + 
            '</table></form>',


            buildRendering: function() {
                this.domNode.innerHTML = formString;
            }
        });

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

这位于 js/widget/

Answer 1

嗯，这里有很多错误的东西......

有一个错字：decalre 而不是 declare
您应该使用 templateString 而不是您的自定义 formString
如果你想让解析器知道它，你必须要求 js/widget/SAUploadForm
您声明了 ready 但您不需要它
应该返回declare的结果

像这样的东西应该可以工作：
（注意：代码片段无法工作，因为代码需要将小部件放入单独的文件中）

//This goes into js/widget/SAUploadForm.js
define(["dojo/_base/declare", "dojo/dom-construct", "dijit/_WidgetBase", "dijit/_TemplatedMixin"],
    function(declare, domConstruct, _WidgetBase, _TemplatedMixin) {
       return declare("js/widget/SAUploadForm", [_WidgetBase, _TemplatedMixin], {
            templateString: '<form method="post" enctype="multipart/form-data" action="/webapp/upload">' +
            '<table>' + 
                '<tr>' + 
                    '<td>File:</td>' + 
                    '<td><input type="file" name="file" value="Browse" accept=".sub" /></td>' + 
                '</tr><tr>' + 
                    '<td colspan="2"><button type="submit">Upload</button></td>' + 
                '</tr>' + 
            '</table></form>'
        });
});

//this goes into the index.html file
require(["dojo/parser", "dojo/domReady!", "js/widget/SAUploadForm"], function(parser) { 
  parser.parse();
});

<script>
    dojoConfig = {
        async : true,
        parseOnLoad : false
    }
</script>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<div>
    <div data-dojo-type="js/widget/SAUploadForm"></div>
</div>

尝试制作一个将创建表单的 dojo 小部件

Trying to make a dojo widget that will create a form

javascript

dojo