1

我在dojo中以声明方式创建了模态对话框，我想在页面加载时向用户显示它，但我不明白为什么下面的代码在页面加载时没有在浏览器上显示任何内容。谁能告诉我我做错了什么？

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Hello Dijit!</title>
    <!-- load Dojo -->

    <link rel="stylesheet" href="../lib/dijit/themes/claro/claro.css">

    <link rel="stylesheet" href="../../css/style.css">


    <script src="../lib/dojo/dojo.js" data-dojo-config="isDebug: true, async: true, parseOnLoad: true"></script>
        <script>
     require(["dojo/ready","dojo/parser","dijit/Dialog", "dijit/form/ComboBox", "dijit/Menu", "dijit/MenuItem", "dojox/form/PasswordValidator","dijit/form/ValidationTextBox","dijit/form/Form","dijit/form/SimpleTextarea","dijit/form/Button"]);</script>
     </script>

</head>
<!-- set the claro class on our body element -->
<body class="claro">
  <div data-dojo-id ="dialogOne" data-dojo-type = "dijit.Dialog" title = "Create Users" style="display: none">
  <div class="dijitDialogPaneContentArea">
    <div class = "formQuestion">
         <span>Personal Details</span>
        </div>    
        <div>

          <label class = "firstLabel" for="Pname">Name </label>
          <input type ="text" id ="Pname" data-dojo-type="dijit.form.ValidationTextBox"
          data-dojo-props = "required :'true', invalidMessage:'',ucfirst:'true'" tabindex = '1'/>
          <label class = "secondLabel" for = "combo">Role </label>
            <Select id="combo" data-dojo-type="dijit.form.ComboBox" tabindex = '2'>
                <option>Admin</option>
                <option>User</option>
            </Select><br>
            <label class = "firstLabel" for="Pemail">Email</label>
                <input type="text" id="Pemail" name="address" 
                    data-dojo-type="dijit.form.ValidationTextBox"
                    data-dojo-props = "placeHolder:'(will be the username)',
                    trim:'true',
                    ucfirst : 'true'" tabindex = '3'/>
            <label class = "secondLabel" for="Pmobile">Mobile</label>
                <input type="text" id="Pmobile" name="address" tabindex = '4'
                    data-dojo-type="dijit.form.ValidationTextBox"
                    data-dojo-props = " trim : 'true',
                    regExp : '(\\d){10}',
                    invalidMessage : 'Mobile number is invalid',
                    ucfirst : 'true'" /><br>
            <div dojoType="dojox.form.PasswordValidator"
            name="password">
            <div><label class = "firstLabel" for ="pass">Password </label><input type="password" id ="pass"
                pwType="new" tabindex = '5'/>
                <label class = "secondLabel" for ="confirm">Confirm Password </label><input type="password"
                pwType="verify" tabindex = '6'/></div>
        </div><br>
<div class ="dijitDialogPaneActionBar">
            <button data-dojo-type = "dijit.form.Button" type ="submit" tabindex = '10' id = "ok" onClick="return dialogOne.isValid();">OK</button>
            <button data-dojo-type = "dijit.form.Button" type = "button" tabindex = '11' onClick = "dialogOne.onCancel();" id = "cancel">Cancel</button>
            </div>
    </div>
    <!-- This event is not firing -->
    <script type="dojo/method" data-dojo-event="onLoad" >
        dialogOne.show();
    </script>
  </div>
 </body>
</html>​
4

2 回答 2

4

试试下面的代码。更改加载道场部分以指向正确的道场路径。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Hello Dijit!</title>
        <!-- load Dojo -->

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


        <script src="../dojo/dojo.js" data-dojo-config="isDebug: true, async: true, parseOnLoad: true"></script>
        <script>
            require(["dojo/ready","dijit/Dialog", "dijit/form/ComboBox", "dijit/Menu", "dijit/MenuItem", "dojox/form/PasswordValidator","dijit/form/ValidationTextBox","dijit/form/Form","dijit/form/SimpleTextarea","dijit/form/Button","dojo/domReady!"]
            , function(ready){
                ready(function(){
                    console.debug("Ready!");
                    dialogOne.show();
                });
            });
        </script>

    </head>
    <!-- set the claro class on our body element -->
    <body class="claro">
        <div data-dojo-id ="dialogOne" data-dojo-type = "dijit.Dialog" title = "Create Users" style="display: none">
            <div class="dijitDialogPaneContentArea">
                <div class = "formQuestion">
                    <span>Personal Details</span>
                </div>    
                <div>
                    <label class = "firstLabel" for="Pname">Name </label>
                    <input type ="text" id ="Pname" data-dojo-type="dijit.form.ValidationTextBox"
                           data-dojo-props = "required :'true', invalidMessage:'',ucfirst:'true'" tabindex = '1'/>
                    <label class = "secondLabel" for = "combo">Role </label>
                    <Select id="combo" data-dojo-type="dijit.form.ComboBox" tabindex = '2'>
                        <option>Admin</option>
                        <option>User</option>
                    </Select><br>
                    <label class = "firstLabel" for="Pemail">Email</label>
                    <input type="text" id="Pemail" name="address" 
                           data-dojo-type="dijit.form.ValidationTextBox"
                           data-dojo-props = "placeHolder:'(will be the username)',
                           trim:'true',
                           ucfirst : 'true'" tabindex = '3'/>
                    <label class = "secondLabel" for="Pmobile">Mobile</label>
                    <input type="text" id="Pmobile" name="address" tabindex = '4'
                           data-dojo-type="dijit.form.ValidationTextBox"
                           data-dojo-props = " trim : 'true',
                           pattern : '(\\d){10}',
                           invalidMessage : 'Mobile number is invalid',
                           ucfirst : 'true'" /><br>
                    <div dojoType="dojox.form.PasswordValidator"
                         name="password">
                        <div><label class = "firstLabel" for ="pass">Password </label><input type="password" id ="pass"
                                                                                             pwType="new" tabindex = '5'/>
                            <label class = "secondLabel" for ="confirm">Confirm Password </label><input type="password"
                                                                                                        pwType="verify" tabindex = '6'/>
                        </div>
                    </div><br>
                    <div class ="dijitDialogPaneActionBar">
                        <button data-dojo-type = "dijit.form.Button" type ="submit" tabindex = '10' id = "ok" onClick="return dialogOne.isValid();">OK</button>
                        <button data-dojo-type = "dijit.form.Button" type = "button" tabindex = '11' onClick = "dialogOne.onCancel();" id = "cancel">Cancel</button>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>​
于 2012-12-13T07:00:05.867 回答
2

尝试在函数dialogOne.show()的回调中调用，将其更改为并将其放在模块数组的末尾require"dojo/ready""dojo/domReady!"

于 2012-05-15T09:49:59.687 回答