Kendo 向 Aurelia 確認 jQuery

Question

我正在嘗試重新排序 KendoUI 確認對話框上的按鈕。 Telerik 支持提供了一個 jQuery 示例，但我似乎無法正確使用 Aurelia 中的語法。

我有這個，這讓我可以按我想要的順序放置按鈕：

  
 
  
  
  
 
   
 
    
        confirm(message: string, title?: any): JQueryPromise<any> {        
            message = this.javaScriptCommentToHTML(message);
            title = this.checkForTitle(title);
            let dialog = $('<div></div>').appendTo(document.body);
            let kConfirm: kendo.ui.Confirm;
            let options: any = {
                buttonLayout: 'normal',
                title: title,
                content: message,
                actions: [
                    {
                        text: "Cancel",
                        primary: false,
                        cssClass: "k-button-cancel",
                        action: function (e) {
                            //  What goes here to trigger cancel action???
                        }
                    },
                    {
                        text: "OK",
                        primary: true,
                        cssClass: "k-button-ok",
                        action: function (e) {
                            //  What goes here to trigger OK action???
                        }
                    }
                ],
                close: function (e) {
                    kConfirm.wrapper.remove();
                }
            };
            kConfirm = dialog.kendoConfirm(options).data('kendoConfirm');
            kConfirm.open();
            return kConfirm.result;
        }
 
   
 
  

但我不知道在按鈕動作中放什么來觸發默認的“確定”和“取消”動作。 Telerik 示例就是這樣，但他們使用的是“secondaryButtonCloseFunction”和“primaryButtonCloseFunction”，我無法讓 Aurelia 識別。

  
 
  
  
  
 
   
 
    
           function showConfirm(message, options) {
              if (options === undefined) {
                options = new Object();
              }
              var dialog = $("#confirm-dialog");
              dialog.kendoDialog({
                closable: false,
                content: message,
                title: options.title || 'Confirm',
                width: options.width || 400,
                height: options.height || 200,
                modal: true,
                buttonLayout: "normal",
                actions: [{
                  text: options.secondaryButtonText || 'Cancel',
                  action: options.secondaryButtonCloseFunction || function () { 
                    alert("No clicked")
                  }
                },
                {
                  text: options.primaryButtonText || 'OK',
                  action: options.primaryButtonCloseFunction || function () { 
                    alert("Yes clicked")
                  },
                  primary: true
                }]
              });
              dialog.data("kendoDialog").open();
            }
 
   
 
  

他們的示例使用通用對象作為“選項”，我嘗試聲明一個單獨的對象來包含那些“xxButtonCloseFunction”屬性，這使我克服了 Aurelia 編譯錯誤，但它沒有做任何事情。

謝謝！

Answer 1

Telerik 帶來了一個 CSS 解決方案來切換按鈕順序。 也許這對其他人有用！

.k-dialog-buttongroup .k-button:first-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
display: flex;
justify-content: flex-end;
}
.k-dialog-buttongroup .k-button:last-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    order: -1;
}