Dialog: Added additional syntax for creating buttons. Fixes #4344 - Dialog: Enhanced Button Option.

Author: scottgonzalez

tests/unit/dialog/dialog_options.js

@@ -71,6 +71,31 @@ test("buttons", function() {
 	el.remove();
 });
 
+test("buttons - advanced", function() {
+	expect(5);
+
+	el = $("<div></div>").dialog({
+		buttons: [
+			{
+				text: "a button",
+				"class": "additional-class",
+				id: "my-button-id",
+				click: function() {
+					equals(this, el[0], "correct context");
+				}
+			}
+		]
+	});
+	var buttons = dlg().find("button");
+	equals(buttons.length, 1, "correct number of buttons");
+	equals(buttons.attr("id"), "my-button-id", "correct id");
+	equals(buttons.text(), "a button", "correct label");
+	ok(buttons.hasClass("additional-class"), "additional classes added");
+	buttons.click();
+
+	el.remove();
+});
+
 test("closeOnEscape", function() {
 	el = $('<div></div>').dialog({ closeOnEscape: false });
 	ok(true, 'closeOnEscape: false');

ui/jquery.ui.dialog.js

@@ -357,10 +357,15 @@ $.widget("ui.dialog", {
 			});
 		}
 		if (hasButtons) {
-			$.each(buttons, function(name, fn) {
-				var button = $('<button type="button"></button>')
-					.text(name)
-					.click(function() { fn.apply(self.element[0], arguments); })
+			$.each(buttons, function(name, props) {
+				props = $.isFunction( props ) ?
+					{ click: props, text: name } :
+					props;
+				var button = $('<button></button>', props)
+					.unbind('click')
+					.click(function() {
+						props.click.apply(self.element[0], arguments);
+					})
 					.appendTo(uiButtonSet);
 				if ($.fn.button) {
 					button.button();