Dojo 1.9 NumberTextBox无法正常工作？

Question

我试图在我的代码中使用Dojo NumberTextBox，由于某种原因，当我将其“移植”到我的网站中时，示例代码无法正常工作。 我直接从Dojo 1.9文档中提取了此示例代码，它的工作原理是：

<html >
<head>

    <link rel="stylesheet" href="../../_static/js/dojo/../dijit/themes/claro/claro.css">

    <script>dojoConfig = {async: true, parseOnLoad: true}</script>
    <script src='../../_static/js/dojo/dojo.js'></script>

    <script>
require(["dojo/parser", "dijit/form/NumberTextBox"]);
    </script>
</head>
<body class="claro">
    <label for="q05">Integer between -20000 to +20000:</label>
<input id="q05" type="text"
    data-dojo-type="dijit/form/NumberTextBox"
    name= "elevation"
    required="true"
    value="3000"
    data-dojo-props="constraints:{min:-20000,max:20000,places:0},
    invalidMessage:'Invalid elevation.'" />
</body>
</html>

这是我的JSP代码，它以一系列JSP页面开始。 如您所见，我已经导入了require（）块，并且我认为它已正确放置（它显示在HTML页面的开头）：

<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.3/dojo/dojo.js.uncompressed.js"></script>
<script src="${pageContext.request.contextPath}/js/mystuff.js"></script>
<script type="text/javascript" >
    dojoConfig={async: true, parseOnLoad: true};
    require(["dojo/parser", "dijit/form/NumberTextBox"]);
</script>

<form:form id="formInfo" commandName="formInfo" action="${flowExecutionUrl}" enctype="multipart/form-data">


<div id="YIBOtherContainer" style="display:none;"> <%-- hidden to start with --%>
    <form:input id="yearsInBusinessOther" path="yearsInBusinessOther"
                data-dojo-type="dijit/form/NumberTextBox"
                data-dojo-props="constraints:{min:6,max:99,places:0}, invalidMessage:'Invalid value.'" />
    <div class="formRow otherIndent">
        <form:errors cssClass="formError" path="yearsInBusinessOther"  />
    </div>
</div>

</form:form>

这是上面的JSP代码生成的HTML INPUT标记：

                    <input id="yearsInBusinessOther" name="yearsInBusinessOther" data-dojo-props="constraints:{min:6,max:99,places:0}, invalidMessage:&#39;Invalid value.&#39;" data-dojo-type="dijit/form/NumberTextBox" type="text" value="99"/>

但是没有验证。 我可以在form字段中键入任何内容，但永远不会收到错误消息，格式更改或任何其他指示正在触发验证的信息。

知道Dojo 1.9的人可以看看这个并（希望）指出我做错了吗？

Answer 1

使用dojoConfig配置Dojo时，必须在加载dojo.js 之前放入dojoConfig配置。 在文档中，您可以注意到它们以正确的顺序加载：

<script>dojoConfig = {async: true, parseOnLoad: true}</script><!-- First -->
<script src='../../_static/js/dojo/dojo.js'></script><!-- Second -->

但是在您的示例中：

<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.3/dojo/dojo.js.uncompressed.js"></script><!-- First but should be second! -->
<script type="text/javascript">
    dojoConfig={async: true, parseOnLoad: true}; // Second, but should be first!
    require(["dojo/parser", "dijit/form/NumberTextBox"]);
</script>

发生的情况是，在加载Dojo时，它正在检查dojoConfig配置的属性。 但是，如果您撤消该命令，则引用Dojo文档：

注意，在加载dojo.js之前，在脚本块中定义了dojoConfig。 这是至关重要的，如果撤消，配置属性将被忽略。

在这种情况下， parseOnLoad会被忽略，这意味着您的输入字段永远不会转换为dijit/form/NumberTextBox 。

所以我建议将您的代码分成：

<script type="text/javascript">
    dojoConfig={async: true, parseOnLoad: true};
</script>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.3/dojo/dojo.js.uncompressed.js">   </script>
<script type="text/javascript">
    require(["dojo/parser", "dijit/form/NumberTextBox"]);
</script>

Answer 2

您可以使用djConfig="parseOnLoad:true"在同一行中执行相同的dojo配置。

<script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.3/dojo/dojo.js.uncompressed.js" djConfig="parseOnLoad:true"></script>

Dojo 1.9 NumberTextBox无法正常工作？

问题描述

2 个解决方案

解决方案1
3 已采纳 2014-04-11 07:02:02

解决方案2
0 2015-03-06 22:36:34

Dojo 1.9 NumberTextBox无法正常工作？

问题描述

2 个解决方案

解决方案1 3 已采纳 2014-04-11 07:02:02

解决方案2 0 2015-03-06 22:36:34

解决方案1
3 已采纳 2014-04-11 07:02:02

解决方案2
0 2015-03-06 22:36:34