jQueryUI的模态 - 添加多个按钮

问题描述：

当使用jQuery UI按钮的模式可以是初始化后，建立像这样：jQueryUI的模态 - 添加多个按钮

$(".selector").dialog("option", "buttons", { "Ok": function() { $(this).dialog("close"); } });

但是我想要做的是添加多个按钮，依赖于逻辑条件：

if (canClose){ 
    $(".selector").dialog("option", "buttons", { "Ok": function() { $(this).dialog("close"); } }); 
} 

if (canAlert){ 
    $(".selector").dialog("option", "buttons", { "Ok": function() { alert('Hello'); } }); 
}

但是，上面的代码将无法正常工作，因为它每次都重置按钮数组。

如何在不丢失任何现有按钮的情况下使用逻辑添加X个按钮？

答

试试这样说：

var buttons = {}; 

if (canClose) { 
    buttons.Close = function() { $(this).dialog("close"); } 
} 

if (canAlert) { 
    buttons.Alert = function() { alert('Hello'); } 
} 

$(".selector").dialog("option", "buttons", buttons);

因此，你只有一次创建对话框。当然，按钮需要两个不同的名字，否则第二个会覆盖第一个。但是，没有几个具有相同文本的按钮，这只是良好的GUI设计。 ;）

答

使用buttons array选项创建两个按钮：

if (canClose && canAlert) 
    $(".selector").dialog("option", "buttons", [ 
     { 
      text: "Ok", 
      click: function() { $(this).dialog("close"); } 
     }, 
     { 
      text: "Ok", 
      click: function() { alert('Hello'); } 
     } 
    ]);

@约西亚-Ruddell我的代码后，我将让所有的四种可能按钮组合通过逻辑。无按钮，一个按钮，另一个按钮或两者。 – 2011-05-10 08:30:57

答

我已经成功通过创建一个数组前期，然后模态按钮属性分配这个实现我的目标：

var buttons = new Array(); 

if (occurance.canEdit){ 
    buttons[buttons.length] = { text: "Edit", click: function(){ editOccurance(data[0],data[1]); } }; 
} 

if (occurance.canDelete){ 
    buttons[buttons.length] = { text: "Delete", click: function(){ deleteOccurance(data[0],data[1]); } }; 
} 

$("#dialogOccurance").dialog("option", "buttons", buttons);

jQueryUI的模态 - 添加多个按钮

相关推荐