2011-12-08 79 views
5

我跟着the dojo tutorial顯示「條款和條件」對話框。 dojo版本是1.7.0。我在Chrome中測試了這個例子。在我的測試頁面中,右鍵單擊以顯示菜單,然後選擇「檢查元素」項目。我在標籤控制檯中發現了一條錯誤消息。錯誤信息是:爲什麼dojo 1.7無法顯示對話框?

Uncaught TypeError: Cannot call method 'show' of undefined 
showDialogdialog 
(anonymous function) 
onclickdialog 

然後我去dojo api page。我發現dojo 1.7.0在類dijit.Dialog下沒有任何方法。那麼如何顯示對話框使用dojo 1.7.0?任何想法?非常感謝。

回答

0

從錯誤消息中,對話框對象是undefined。您仍然使用show函數來顯示dijit.Dialog。仔細檢查dijit.Dialog實例是否成功創建。

示例代碼:

var dlg = new dijit.Dialog({ 
    id: "myDialog", 
    title: "Sample", 
    content: "<div>Hello World!</div>" 
}); 
dlg.show(); 

,你不能看到API文檔的show功能,因爲這個功能show在一個內部類dijit._DialogBase實際聲明的原因。

+0

好像API工具應該是撿了繼承的方法(和顯示他們當「在」按鈕,綠色的是上。聽起來像是另一個錯誤,可能與AMD轉換有關 – peller

4

這似乎是Google CDN的一個問題,因爲該教程示例可以正常使用Dojo 1.7的本地副本。

Dojo加載器加載文件Dialog.js,但無法解析它,這會導致「parser.js:8未捕獲錯誤:無法加載類'dijit.Dialog'」。

dijit.Dialog.show()方法缺失,因爲對話框小部件沒有實例化,而dijit.byId(「terms」)返回「undefined」。

要通過腳本標籤解決此負載dijit.Dialog類/文件:

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.0/dijit/Dialog.js"></script> 

我填補了這一問題納入道場bug跟蹤系統:Ticket #14415

0

我已經嘗試過dojo 1.7.1,它的代碼是http://jsfiddle.net/nv4YC/dojo 1.7.0也可以。

From your link (the dojo tutorial) 它必須改變

dojo.require("dijit.Dialog");

,並在腳本標籤應該有異步:真

這樣data-dojo-config="async: true, parseOnLoad:true"

讓我的jsfiddle看到或嘗試這個代碼

<head> 
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css"> 
    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/dojo.js" 
    data-dojo-config="async: true, parseOnLoad:true"></script> 
    <script> 
     require(["dijit/registry", "dijit/Dialog"], function (registry) 
     { 
      // Show the dialog 
      showDialog = function showDialog() 
      { 
       registry.byId("terms").show(); 
      } 
      // Hide the dialog 
      hideDialog = function hideDialog() 
      { 
       registry.byId("terms").hide(); 
      } 
     }); 
    </script> 
</head> 

<body class="claro"> 
    <button onclick="showDialog();">View Terms and Conditions</button> 
    <div class="dijitHidden"> 
     <div data-dojo-type="dijit.Dialog" style="width:600px;" data-dojo-props="title:'Terms and Conditions'" 
     id="terms"> 
      <p> 
       <strong>Please agree to the following terms and conditions:</strong> 
      </p> 
      <div style="height:160px;overflow-y:scroll;border:1px solid #769dc4;padding:0 10px;width:600px"> 
       <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sed suscipit 
        massa. Aenean vel turpis tincidunt velit gravida venenatis. In iaculis 
        urna non quam tincidunt elementum. Nunc pellentesque aliquam dui, ac facilisis 
        massa sollicitudin et. Donec tincidunt vulputate ultrices. Duis eu risus 
        ut ipsum auctor scelerisque non quis ante. Nam tempor lobortis justo, et 
        rhoncus mauris cursus et. Mauris auctor congue lectus auctor ultrices. 
        Aenean quis feugiat purus. Cras ornare vehicula tempus. Nunc placerat, 
        lorem adipiscing condimentum sagittis, augue velit ornare odio, eget semper 
        risus est et erat....</p> 
      </div> 
      <button onclick="hideDialog();">I Agree</button> 
      <button onclick="alert('You must agree!');">I Don't Agree</button> 
     </div> 
    </div> 
</body>