2012-07-02 135 views
4

如何在dojo中創建確認對話框?我希望有一個好的取消對話框出現在按鈕點擊與dojo對話框(沒有JavaScript確認對話框)。 到目前爲止,我只能在點擊事件中顯示一個對話框。 繼承人我的代碼:確認dojo對話框

<script type="text/javascript"> 
dojo.require("dijit.form.Button"); 
dojo.require("dijit.Dialog"); 

var secondDlg; 
dojo.ready(function(){ 
    // create the dialog: 
    secondDlg = new dijit.Dialog({ 
     title: "Programmatic Dialog Creation", 
     style: "width: 300px", 
    draggable:false 
    }); 
}); 
showDialogTwo = function(){ 
    // set the content of the dialog: 
    secondDlg.set("content", "Hey, I wasn't there before, I was added at " + new Date() + "!"); 
    secondDlg.show(); 
} 
</script> 
</head> 
<body class="claro" style="margin-right:10px;"> 
<button id="buttonTwo" data-dojo-type="dijit.form.Button" data-dojo-props="onClick:showDialogTwo" type="button">Show me!</button> 
</body> 

我怎樣才能使這個確定取消對話框?

回答

0

上面的解決方案沒有考慮到對話框右上角的小十字。

我做了很久以前,一個小對話框的套件,你可以在這裏找到一些快樂,尤其是ConfirmDialog.js 我今天剛剛上傳他們在github上,所以你可以在他們看一看:http://github.com/PEM-FR/Dojo-Components/tree/master/dojox/dialog

它們應該可以「按原樣」使用或進行較小的更改

2
<script type="dojo/method" event="onClick"> 
        var dialog = new dijit.Dialog({ 
         title: "Delete Switch Type", 
         style: "width: 400px", 
         content : "Do you really want to delete ?????<br>" 
        }); 
        //Creating div element inside dialog 
        var div = dojo.create('div', {}, dialog.containerNode); 
        dojo.style(dojo.byId(div), "float", "left"); 

        var noBtn = new dijit.form.Button({ 
           label: "Cancel", 
           onClick: function(){ 
            dialog.hide(); 
            dojo.destroy(dialog); 
           } 
          }); 

        var yesBtn = new dijit.form.Button({ 
           label: "Yes", 
           style : "width : 60px", 
           onClick : <your function here>, 
           dialog.hide(); 
        dojo.destroy(dialog); 
           } 
          }); 
            //adding buttons to the div, created inside the dialog 
        dojo.create(yesBtn.domNode,{}, div); 
        dojo.create(noBtn.domNode,{}, div); 
        dialog.show(); 
       </script> 

我使用此代碼作爲內聯dojo /方法 - 在按鈕的單擊事件上。你仍然可以修改