javascript - 在DOJO确认对话框中动态设置onExecute回调函数

Question

我的 jsp 中有两个 html 按钮。一个是“添加”，另一个是“删除”。 现在，如果单击其中一个按钮，就会显示一个 dojo 确认对话框。单击对话框中的“确定”后，将执行添加或删除功能。此 Dojo 对话框存在于父 jsp 页面之一中，该父 jsp 页面将由存在添加或删除功能的其他 jsp 页面重用。根据添加/删除按钮的点击确认消息也需要更改。前任。对于添加，消息应为“您要添加吗”，对于删除，消息应为“您要删除吗”。我能够在 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 block - 以相同的方式 - 您设置内容的方式。

还有一个建议是 - 将 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>

和道场-

    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");
    }