Question

我的jsp中有两个html按钮。一个是添加，另一个是删除。现在如果单击该按钮，则会显示一个dojo确认对话框。单击对话框中的“确定”，将执行“添加或删除功能”。此Dojo对话框出现在其中一个父jsp页面中，该页面将被其他jsp页面重用，其中存在Add或Remove functionlity。取决于添加/删除按钮，单击确认消息也需要更改。防爆。对于添加，消息应为“您要添加”，对于删除消息将是“您要删除”。我能够在DOJO Cinfirm对话框中动态设置消息，但无法设置onExecute回调函数，即。如果确定将在对话框中单击。下面是代码。

注意：我使用的是DOJO 1.10库

确认对话框代码：

require(["dijit/ConfirmDialog", "dojo/domReady!"], function(ConfirmDialog){
    myDialog = new ConfirmDialog({
        title: "GCLDW - Confirm Dialog",
        content: "",
        style: "width: 300px;",
        onExecute:function(){
            removeCustomer();
        }
    });
});

HTML按钮代码：

<button type="button" id="removeCustomerButton"
        onclick="myDialog.set('content', 'Do you want to remove the selected item ?<br><br>');myDialog.show();">
                                <SPAN class=grey><EM><s:message
                                    code="customer.removeCustomer" text="" /></EM>
                                </SPAN>
</button>

<button type="button" id="addCustomerButton"
        onclick="myDialog.set('content', 'Do you want to Add the selected item ?<br><br>');myDialog.show();">
                                <SPAN class=grey><EM><s:message
                                    code="customer.addCustomer" text=""/></EM>
                                </SPAN>
</button>

现在如何根据按钮单击设置onExecute回调函数，无论是addCustomer（）还是removeCustomer（），并且使用此对话框的任何页面都将拥有自己的这两种方法的实现。

Answer 1

只需设置onExecute块 - 就像设置内容的方式一样。

另外一个建议是 - 将JS代码与HTML 分开。

这是解决方法 -

HTML代码 -

<button type="button" id="removeCustomerButton">
        <SPAN class=grey><EM>Remove</EM></SPAN>
</button>

<button type="button" id="addCustomerButton">
        <SPAN class=grey><EM>Add</EM></SPAN>
</button>

<强>＆安培; DOJO -

    require(["dijit/ConfirmDialog", "dojo/domReady!"], 
            function(ConfirmDialog){
                var myDialog = new ConfirmDialog({
                    title: "GCLDW - Confirm Dialog",
                    content: "",
                    style: "width: 300px;"
                });

                dojo.query('#removeCustomerButton').onclick( function() {
                    myDialog.set('content', 'Do you want to remove the selected item ?<br><br>');
                    myDialog.set('onExecute', function(){removeCustomer()} );   // cant call it directly- must wrap within a function
                    myDialog.show();
                });

                dojo.query('#addCustomerButton').onclick( function() {
                    myDialog.set('content', 'Do you want to Add the selected item ?<br><br>');
                    myDialog.set('onExecute', function(){addCustomer()} );  // cant call it directly- must wrap within a function
                    myDialog.show();
                });


            });


    function removeCustomer(){
        console.log("removeCustomer called on execute");
    }

    function addCustomer(){
        console.log("addCustomer called on execute");
    }

Answer 2

在 /dojo-release-1.10.4-src/dijit/_DialogMixin.js 中，评论说明：

execute: function(/*Object*/ /*===== formContents =====*/){
// summary:
//      Callback when the user hits the submit button.
//      Override this method to handle Dialog execution.

我实现了 ConfirmDialog ，如下所示：

var confirmDialog = new ConfirmDialog({
    title: core.confirm
});
confirmDialog.startup();

function confirmAction(text, callbackFn) {
    confirmDialog.set("execute", callbackFn);
    confirmDialog.set("content", text);
    confirmDialog.show();
}

并将其称为：

lib.confirmAction(core.areyousure, function () {
    markedForDeletion.forEach(function (node) {
        // Do deletion
    });
});

在DOJO确认对话框

2 个答案: