Question

未正确解析dijit / form / DateTextBox的原因是什么？

以下是该方案：

我有一个页面，其中正确呈现了以下控件： correct date

然后用户可以重定向到另一个页面，我们将他在当前页面上选择的日期存储起来。当他在页面上导航时，他应该再次找到之前输入的日期。日期的值是正确的，但似乎未正确解析Dojo控件，因为我得到以下内容： wrong date

在哪种情况下我们可以错误地解析Date？

重要提示：我只是在Chrome上收到此错误，这与IE和FireFox配合得很好。

非常感谢！

编辑：以下内容允许重现此问题：

<!DOCTYPE html>
<HTML>
<HEAD>

    <TITLE>Dojo - RS - Date Picker demonstration</TITLE>

    <LINK rel="stylesheet" href="../dojoExtension/dojo/resources/dojo.css"                                                  

    <SCRIPT type="text/javascript">
        dojoConfig = {
                baseUrl: "../dojoExtension/dojo",
                parseOnLoad: false,
                async:true,
                locale: "fr-ch"
        };
    </SCRIPT>

    <SCRIPT type="text/javascript" src="../dojoExtension/dojo/dojo.js">    </SCRIPT>

    <SCRIPT type="text/javascript">
        function loading() {
            require(["dojo/parser", "dijit/form/DateTextBox", "dojo/domReady!"], function(parser){
                parser.parse();
            });
        }

        function replaceDate() {

            require(["dojo/dom-construct", "dojo/_base/window", "dojo/parser" , "dijit/form/DateTextBox", "dojo/domReady!"], function(domConstruct,win,parser){
                var row = "<INPUT type=text data-dojo-type=dijit/form/DateTextBox name=datePickerDemo id=idDatePickerDemo >";
                try {
                    var newRow = domConstruct.place(domConstruct.toDom(row), win.body() );
                    }
                catch(err) {
                    alert(err);
                }
            });
        }

    </SCRIPT>

</HEAD>
<BODY onload="loading();"
      class="tundra">

    <DIV id="myDiv" style="position:fixed; top:150px; left:150px">

        <script type="text/javascript">
            require(["dijit/form/DateTextBox"]);
        </script>

        <INPUT type="text"
               data-dojo-type="dijit/form/DateTextBox" 
               name="datePickerDemo"
               id="idDatePickerDemo" />

        <a href="javascript:replaceDate()">replace the date</a>

    </DIV>


</BODY>
</HTML>

Answer 1

好的，似乎真的来自一个＆＃34;解析器＆＃34;问题，以下是有效的：

    <!DOCTYPE html>
<HTML>
    <HEAD>

        <TITLE>Dojo - RS - Date Picker demonstration</TITLE>

        <LINK rel="stylesheet" href="../dojoExtension/dojo/resources/dojo.css" />
        <LINK rel="stylesheet" href="../dojoExtension/dijit/themes/dijit.css" />
        <LINK rel="stylesheet" href="../dojoExtension/dijit/themes/tundra/tundra.css" />
        <LINK rel="stylesheet" href="../dojoExtension/dijit/themes/tundra/form/Button.css" />
        <LINK rel="stylesheet" href="../dojoExtension/dijit/themes/tundra/form/Common.css" />

        <SCRIPT type="text/javascript">
            dojoConfig = {
                    baseUrl: "../dojoExtension/dojo",
                    parseOnLoad: false,
                    async:true,
                    locale: "fr-ch"
            };
        </SCRIPT>

        <SCRIPT type="text/javascript" src="../dojoExtension/dojo/dojo.js"></SCRIPT>

        <SCRIPT type="text/javascript">
            function loading() {
                require(["dojo/parser", "dijit/form/DateTextBox", "dojo/domReady!"], function(parser){
                    parser.parse();
                });
            }

            function replaceDate() {

                require(["dojo/dom-construct", "dojo/_base/window", "dojo/parser", "dijit/registry", "dijit/form/DateTextBox", "dojo/domReady!"], function(domConstruct,win,parser,registry){
                    var row = '<INPUT type="text" data-dojo-type="dijit/form/DateTextBox" name="datePickerDemo" id="idDatePickerDemo2" >';
                    var domObject = domConstruct.toDom(row);
                    try {
                        var newRow = domConstruct.place(domObject, win.body() );
                        parser.parse(registry.byId("idDatePickerDemo2"));
                        }
                    catch(err) {
                        alert(err);
                    }
                });
            }

        </SCRIPT>

    </HEAD>
    <BODY onload="loading();"
          class="tundra">

        <DIV id="myDiv" style="position:fixed; top:150px; left:150px">

            <script type="text/javascript">
                require(["dijit/form/DateTextBox"]);
            </script>

            <INPUT type="text"
                   data-dojo-type="dijit/form/DateTextBox" 
                   name="datePickerDemo"
                   id="idDatePickerDemo" />

            <a href="javascript:replaceDate()">replace the date</a>

        </DIV>


    </BODY>
</HTML>

好吧，似乎我的问题来自于＆＃34;解析器＆＃34;理解:) ...但我们可以将此特定问题视为已解决。

感谢回答的人，这肯定有很多帮助！

Answer 2

您已使用dijit/registry来获取不正确的domNode。

dijit/registry将搜索与domNode对象不同的dojo小部件。

dojo/dom模块应该用于通过id搜索domNodes 即

require(["dojo/dom"], 
    function(dom){ 
      dom.byId('domId') 
    }
);

查看here以获取registry.byId和dom.byId之间的详细说明

在您的实例中，replaceDate（）将更改为

 function replaceDate() {

        require(["dojo/dom", "dojo/dom-construct", "dojo/_base/window", "dojo/parser", 
                 "dijit/registry", "dijit/form/DateTextBox", "dojo/domReady!"], 
            function(dom, domConstruct,win,parser,registry){
                var row = '<INPUT type="text" data-dojo-type="dijit/form/DateTextBox" name="datePickerDemo" id="idDatePickerDemo2" >';
                var domObject = domConstruct.toDom(row);
                try {
                    var newRow = domConstruct.place(domObject, win.body() );
                    // Use dom.byId instead of registry.byId
                    parser.parse(dom.byId("idDatePickerDemo2"));
                    }
                catch(err) {
                    alert(err);
                }
        });
 }

dijit / form / DateTextBox未正确解析

2 个答案: