2011-12-08 39 views
5

Tôi đã theo dõi the dojo tutorial để hiển thị hộp thoại "Điều khoản và điều kiện". Phiên bản dojo là 1.7.0. Tôi đã thử nghiệm ví dụ trong chrome. Trong trang kiểm tra của tôi, tôi nhấp chuột phải để hiển thị menu rồi chọn mục "Kiểm tra phần tử". Tôi đã tìm thấy thông báo lỗi trong bảng điều khiển tab. Thông báo lỗi là:Tại sao dojo 1.7 không thể hiển thị hộp thoại?

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

Sau đó, tôi chuyển đến dojo api page. Tôi tìm thấy dojo 1.7.0 không có phương thức nào theo lớp dijit.Dialog. Vậy làm thế nào để hiển thị hộp thoại dojo 1.7.0? Bất kỳ ý tưởng? Cảm ơn bạn rất nhiều.

Trả lời

0

Từ thông báo lỗi, đối tượng hộp thoại là undefined. Bạn vẫn sử dụng chức năng show để hiển thị dijit.Dialog. Kiểm tra kỹ xem phiên bản dijit.Dialog có được tạo thành công không.

Mẫu mã:

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

Lý do mà bạn không thể nhìn thấy show chức năng trong doc api là vì show chức năng này thực sự là tuyên bố trong một lớp học nội dijit._DialogBase.

+0

có vẻ như công cụ API nên được chọn lên các phương pháp di truyền (và hiển thị chúng khi xanh 'trong' nút là trên.Âm thanh như một lỗi khác, có thể liên quan đến quá trình chuyển đổi AMD – peller

4

Có vẻ như đó là sự cố với Google CDN, vì ví dụ hướng dẫn hoạt động tốt với bản sao cục bộ của Dojo 1.7.

Trình tải xuống bộ tải tệp tải xuống Dialog.js, nhưng không thể phân tích cú pháp, kết quả là "parser.js: 8 Lỗi không bắt buộc: Không thể tải lớp 'dijit.Dialog'".

phương thức dijit.Dialog.show() bị thiếu vì tiện ích Dialog không được hỗ trợ và dijit.byId ("terms") trả về "undefined".

Để workaround này tải dijit.Dialog lớp/file qua thẻ script:

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

tôi điền vấn đề này vào Dojo lỗi tracker: Ticket #14415.

0

Tôi đã thử dojo 1.7.1 và nó hoạt động với mã nàyhttp://jsfiddle.net/nv4YC/dojo 1.7.0 cũng hoạt động.

From your link (the dojo tutorial) nó phải thay đổi

dojo.require("dijit.Dialog");

và tại thẻ script nên có async: true

như thế nàydata-dojo-config="async: true, parseOnLoad:true"

Hãy xem trên jsfiddle tôi hoặc thử mã này

<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> 

Các vấn đề liên quan